0

私は webdevelopment にかなり慣れていないので、コード ビハインド エクスポートを実行しているときに、読み込み中の gif が表示されないようです。

私の onclick イベントは、グリッドビュー内の Imagebutton にあります。手伝ってくれませんか？ここに ImageButtons があります。

<HeaderTemplate>
      <asp:ImageButton ID="btnExport"  OnClick="btnExport_Click" runat="server" ImageUrl="~/Images/excel.gif"  AlternateText="Export top records!"/>
      <asp:ImageButton ID="btnExportRed"   OnClick="btnExportRed_Click" runat="server" ImageUrl="~/Images/excel_red.gif"  AlternateText="Export all records!"/>
 </HeaderTemplate>

これは私のコードビハインドです:

protected void btnExport_Click(object sender, EventArgs e)
 {
    try
    {
        LoadWaitImage();


          [functional code]

      UnloadWaitImage();
    }
    catch (Exception ex)
    {
        lblMessage.Text = ex.Message;
        upnlMsg.Update();
       UnloadWaitImage();
    }
}


private void LoadWaitImage()
 {
    ScriptManager.RegisterClientScriptBlock(this.Page, this.GetType(), "showMyImage", "hideLoading()", true);
 }

private void UnloadWaitImage()
{
    ScriptManager.RegisterClientScriptBlock(this.Page, this.GetType(), "showMyImage", "hideLoading()", true);
}

そして起動するjs：

function showLoading() 
{
   document.getElementById('lblMessage').value = "";
   document.getElementById('ucMarketing_btnSearch').disabled = true;
   document.getElementById('btnClearFilters').disabled = true;
   document.getElementById('imgSaveToSegments').disabled = true;
   document.getElementById('divLoadingImg2').style.display = "";
 }
function hideLoading()
{
  document.getElementById('ucMarketing_btnSearch').disabled = false;
  document.getElementById('btnClearFilters').disabled = false;
  document.getElementById('imgSaveToSegments').disabled = false;
  document.getElementById('divLoadingImg2').style.display = "none";
 }
4

2 に答える 2

0

最後に、OnClientClick イベントを使用して Js を開始しました。OnClick イベントは、エクスポートのためにサーバー側の機能を実行します。私のエクスポート機能では、一意の Cookie トークンを追加しました。そのトークンを隠しフィールドに保存し、毎秒変更します。Js 関数では、タイマーを開始し、Cookie がトークンと一致するかどうかを確認します。そうであれば、読み込み中の画像を非表示にします。

ここでこのソリューションを見つけました: Detect when browser receive file download。

例を次に示します: http://geekswithblogs.net/GruffCode/archive/2010/10/28/detecting-the-file-download-dialog-in-the-browser.aspx。

于 2012-08-31T08:11:42.673 に答える
0

あなたの今の考えがうまくいくとは思えません。HTML をレンダリングするクライアント ブラウザーは、コード ビハインドを実行するサーバーから完全に分離されています。ImageButton がクリックされると、ブラウザは同期的に HTML フォームをサーバーに送信し、応答を待ちます。この応答は、イベント ハンドラー メソッドの終了後、しばらくしてから送信されます。

クライアント側で処理を行う場合 (画像の表示と非表示など)、AJAX を使用して非同期で処理する必要があります。ASP.Net WebForms では、コントロールを使用してこれを非常に簡単に行うことがUpdatePanelできます。

これを機能させるには、変更するページの領域をUpdatePanel コントロールで囲みます。次に、更新を実行するトリガーを 1 つ以上追加します。最後に、UpdateProgressコントロールを使用して読み込み中の画像を表示します。このようなもの：

<asp:GridView runat="server">
   ...
   <HeaderTemplate>
      <asp:ImageButton ID="btnExport" OnClick="btnExport_Click" runat="server" 
            ImageUrl="~/Images/excel.gif"  AlternateText="Export top records!"/>
      <asp:ImageButton ID="btnExportRed" OnClick="btnExportRed_Click" runat="server"
            ImageUrl="~/Images/excel_red.gif"  AlternateText="Export all records!"/>
   </HeaderTemplate>
</asp:GridView>

<asp:UpdatePanel ID="Update" runat="server">
   <asp:UpdateProgress ID="Progress" runat="server">
      <ProgressTemplate>
         <!-- HTML/ASP for your image -->
      </ProgressTemplate>
   </asp:UpdateProgress>
   <Triggers>
      <asp:AsyncPostBackTrigger ControlID="btnExport" EventName="Click" />
   </Triggers>
</asp:UpdatePanel>

クライアント側のことをもっとやりたい場合は、この回答を参照してください。

于 2012-08-29T08:46:49.507 に答える