單擊按鈕後加載指示器

我想在用戶點擊執行多個SQL查詢的按鈕後顯示加載指示器。我嘗試在按鈕單擊時取消隱藏div，但在按鈕後面的所有工作完成之前不會顯示。我也試過這個解決方案沒有成功 - http://forums.asp.net/t/1608046.aspx/1 單擊按鈕後加載指示器

有什麼建議嗎？

code

<asp:Button ID="loadButton" OnClientClick="ShowDiv()" runat="server" 
onclick="loadButton_Click" Text="Go" /> 


<script type="text/javascript"> 
    function ShowDiv() 
    {setTimeout('document.getElementById("updatediv").style.display = "inline";', 500);}} 
</script> 


<div ID="updatediv" runat="server" > 
<img src="Images/ajax-loader.gif" /> Updating .... 
</div>

code

我使用上述連接解決方案時，出現以下錯誤： enter image description here

**這似乎這樣的伎倆

code

<script type="text/javascript" language="javascript"> 
function ShowDiv() 
    $('#updatediv').show() } 
</script>

code

enter image description here

來源

2012-04-12 Blake

請向我們顯示您的代碼。 – SLaks 2012-04-12 14:22:01

你需要顯示代碼才能在這裏獲得幫助。否則，它在黑暗中拍攝，並沒有表明你實際上已經嘗試過任何東西。 – RogueSpear00 2012-04-12 14:22:57

@布萊克 - 對於需要使用ajax的更新。 – coder 2012-04-12 15:03:13

你必須在客戶端上顯示的div，而不是服務器端。除了服務器端Click事件之外，ASP按鈕還有一個方便的OnClientClick。

這當然是你顯示的鏈接。如果你遵循它，那麼它不應該等待完成回發才能執行。

來源

2012-04-12 14:23:38 Servy

CSS：

<style type="text/css"> 
     #UpdateProgress1 { 
      top:450px; left: 450px; 
      position: absolute; 
      background-color: #C3E1FF; 
      background-repeat: repeat-x; } 
</style>

添加scriptMananger，UpdatePanel中，如下所示：

<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager> 
     <asp:UpdatePanel ID="UpdatePanel1" runat="server"> 
      <ContentTemplate> 
       <table runat="server" border="1" width="98%" align="center"> 
       <tr><td></td></tr> 
       </table> 
       <asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1"> 
          <ProgressTemplate> 
           <img src="Images/Loading.gif" /><br /><center><font color=red>Processing Data...</font></center> 
          </ProgressTemplate> 
         </asp:UpdateProgress> 
       </ContentTemplate> 
      <Triggers> 
       <asp:AsyncPostBackTrigger ControlID="btnprocess" /> 
      </Triggers> 
     </asp:UpdatePanel>

然後給予一定的計時器

System.Threading.Thread.Sleep(3000);

如果您使用簡單的jQuery，你需要做的阿賈克斯的方式，這裏是你應該如何處理阿賈克斯：

$('#ShowDiv') 
    .hide() // hide 
    .ajaxStart(function() { 
     $(this).show(); 
    }) 
    .ajaxStop(function() { 
     $(this).hide(); 
});

來源

2012-04-12 14:28:48 coder

如果OP使用UpdatePanel，我喜歡這個解決方案。目前尚不清楚他是否是。 – Servy 2012-04-12 14:30:23

@塞維 - 謝謝你。如果他用或不用，他可能會提及它，但從我們的最終，我已經給他這樣做的可能性:) – coder 2012-04-12 14:31:43

這是一個值得發佈的好方案，不管OP是否可以使用它;我沒有批評你發佈它。 – Servy 2012-04-12 14:34:49

單擊按鈕後加載指示器

回答

相關問題