（ASP页面查询等待提示效果）GridViewなどで検索中に「処理中メッセージ」を表示する方法（※他の長い時間処理も参照できる）

原博客http://ino1970.blog119.fc2.com/blog-entry-163.html

GridViewなどで検索中に「処理中メッセージ」を表示する方法

これは単純にstylsheetで表示・非表示にする方法で実現します。

メッセージエリアを表示させるトリガとなるコントロールは何でもよいですが

以下の例ではDropDownList(AutoPostBack=True）です。

DropDownListが変更された瞬間javascriptによりメッセージ領域が表示され、その後の

AutoPostBackでサーバ側処理は実行されます。

サーバ側処理の実行結果が、同画面に戻ってきてメッセージ領域は再描画され再び非表示になります。

①メッセージエリアの用意

position:absoluteなのでどこで邪魔になりません。formの直後にでも・・・

但しupdatepanelを使っている場合、ボタンと同じようにその中に入れて下さい。

<div id="waitMsg" style="display:none; padding:20px 40px; color:White; position:absolute;top:250px; left:150px">

検索中です。　しばらくお待ち下さい。

</div>

②Javascriptの準備

   <script type="text/javascript" language="javascript">
       function changeVisible() {
           var idWaitMsg = document.getElementById('waitMsg');
           if (idWaitMsg.style.display == 'none') {
               idWaitMsg.style.display = 'block'; //表示する。
           } else {
           idWaitMsg.style.display = 'none'; //非表示にする。
           }
       } 
   </script>

③コントロールにjavascriptを貼り付ける

Load時にでも属性を付与しましょう。

ドロップダウンならonchange

DropDownList1.Attributes["onchange"] = "changeVisible(); ";

ラジオボタンならonClick

RadioButtonList1.Attributes["onClick"] = "changeVisible(); ";