はじめ
にWeb アプリケーションのフォーム送信プロセス中に、特に送信プロセスに時間がかかる場合に、「お待ちください」メッセージやアニメーション GIF イメージを表示すると便利なことがよくあります。私は最近、内部ユーザーが Web ページ経由で Excel スプレッドシートをアップロードするアンケート送信プログラムを開発しました。プログラムは、アップロードされたスプレッドシート データをデータベースに挿入します。このプロセスには数秒しかかかりませんが、たとえ数秒だったとしても、Web ページの観点からは非常に明らかな待機プロセスです。プログラムのテスト中に、一部のユーザーがアップロード ボタンを繰り返しクリックしました。したがって、アップロードが進行中であることを伝える視覚的なメッセージを提供すると便利です。また、複数のクリックを防ぐために、同時にアップロード ボタンを非表示にします。ここで紹介するコントロールは Button コントロールのサブクラスであり、クライアント側の JavaScript コードを ASP.NET サーバー コントロールにカプセル化して便利な機能を提供する方法を示します。
これを実現するための JavaScript の例は数多くありますが、これらの関数を ASP.NET コントロールにカプセル化しようとすると、いくつかの問題が見つかりました。まず、JavaScript の onclick ハンドラーを使用してボタンを無効にし、他のテキストに置き換えようとしました。しかし、これはasp.netサーバー側のクリックイベントの機能を妨げるため、これは非常に難しいことがわかりました。最終的に機能し、さまざまなブラウザを適切にサポートできるようになったのは、ボタンを div タグでレンダリングすることでした。 div は非表示にして、asp.net のクリック イベントの邪魔にならないようにすることができます。
コントロールの使用方法
通常のボタン コントロールから派生したものである PleaseWaitButton の機能は基本的に同じです。 3 つの追加プロパティを使用して、ボタンがクリックされたときの「お待ちください」メッセージまたは画像の表示を管理します。
お待ちくださいテキスト
これは表示されるクライアント側のテキスト メッセージであり、存在する場合は、ボタンがクリックされたときにボタンを置き換えます。
お待ちください画像
これは表示される画像ファイル (アニメーション GIF 画像など) であり、存在する場合は、クリックされたときにボタンを置き換えます。この属性は、 タグの src 属性になります。
お待ちくださいタイプ
PleaseWaitTypeEnum 列挙値のいずれか: TextOnly、ImageOnly、TextThenImage、または ImageThenText。メッセージと画像のレイアウトを制御します。
以下は、PleaseWaitText と PleaseWaitImage が設定された PleastWaitButton を示す .aspx ファイルの例です。
<%@ ページ言語="C#" %>
<%@ 登録 TagPrefix="cc1" 名前空間="JavaScriptControls"
Assembly="PleaseWaitButton" %>
<頭>