Ladeanzeige nach dem Klick auf die Schaltfläche

Ich bin zu wollen, um zu zeigen, eine Ladeanzeige, nachdem der Benutzer eine Schaltfläche geklickt, führt mehrere SQL-Anfragen. Ich habe versucht einblenden eines div-auf die Taste klicken, Sie aber nicht zeigen, bis alle die Arbeit hinter der Schaltfläche ist fertig. Ich habe auch versucht, diese Lösung ohne Erfolg - http://forums.asp.net/t/1608046.aspx/1

Irgendwelche Vorschläge?

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

Bekomme ich die folgende Fehlermeldung, wenn mit der verlinkten Lösung oben:
Ladeanzeige nach dem Klick auf die Schaltfläche

**Dies schien, den trick zu tun

code

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

code

Ladeanzeige nach dem Klick auf die Schaltfläche

Bitte zeigen Sie uns Ihren code.
Sie brauchen, um code, um hier etwas Hilfe zu bekommen. Ansonsten ist es das Schießen in der Dunkelheit, und nicht zeigen, dass man tatsächlich etwas versucht.
das update müssen Sie die Verwendung von ajax.
Ich bin nicht mit einem ajax-call... kann ich nicht bieten UI-feedback ohne?

InformationsquelleAutor Blake | 2012-04-12

  1. 1

    Müssen Sie die show-div-Element auf der client-Seite, nicht der server-Seite. ASP-Tasten haben eine handliche OnClientClick zusätzlich zu der server-Seite Click Veranstaltung.

    Dies ist natürlich, was der link, den Sie zeigen, nicht. Wenn Sie ihm Folgen, dann sollte es nicht warten, um zu beenden den postback ausführen.

    InformationsquelleAutor Servy

  2. 0

    CSS:

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

    Hinzufügen scriptMananger,UpdatePanel, wie gezeigt:

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

    Und dann geben einige timer

    System.Threading.Thread.Sleep(3000);

    Wenn Sie mit Einfachen JQuery Sie tun müssen, ajax Weg, und hier ist, wie Sie tun sollten, mit ajax:

    $('#ShowDiv')
    .hide()  //hide
    .ajaxStart(function() {
        $(this).show();
    })
    .ajaxStop(function() {
        $(this).hide();
});
    Ich mag diese Lösung, wenn die OP ist mit einem UpdatePanel. Es ist nicht klar, ob oder nicht er ist.
    für, die.Wenn er Sie nutzt oder nicht, er könnte es zu erwähnen, klar, aber von unserem Ende ich habe ihm die Möglichkeit so zu tun 🙂
    Es ist eine großartige Lösung lohnt sich die Buchung, unabhängig davon, ob OP es verwenden können; ich war nicht dein posting kritisieren.
    dass es Euch gefallen hat 🙂
    Können wir ein jsfiddle für die Ausgabe sir?

    InformationsquelleAutor coder

Schreibe einen Kommentar