2

ユーザーがいくつかの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

上記のリンクされたソリューションを使用すると、次のエラーが発生します。 ここに画像の説明を入力してください

**これはトリックを行うようでした

code

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

code

ここに画像の説明を入力してください

4

2 に答える 2

1

サーバー側ではなく、クライアント側にshowdivを設定する必要があります。ASPボタンには、サーバー側のイベントOnClientClickに加えて便利なものがあります。Click

もちろん、これはあなたが表示するリンクが行うことです。あなたがそれに従ったなら、それは実行するためにポストバックを終えるのを待つべきではありません。

于 2012-04-12T14:23:38.440 に答える
0

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);

Simple JQueryを使用している場合は、ajaxの方法を実行する必要があり、ajaxを使用する方法は次のとおりです。

$('#ShowDiv')
    .hide()  // hide
    .ajaxStart(function() {
        $(this).show();
    })
    .ajaxStop(function() {
        $(this).hide();
});
于 2012-04-12T14:28:48.450 に答える