Eine Eingabeschaltfläche mit jQuery ausblenden und auch eine AJAX-Funktion mit .NET auslösen

Question

Ich habe eine Eingabeknopf zum Hinzufügen von Elementen zu einem Warenkorb. Grundsätzlich ist der ideale Fall, dass der Benutzer auf den Eingabeknopf klickt, er verschwindet, zeigt das Laden-GIF an, und sobald der Artikel in den Warenkorb gelegt wurde, erscheint der Button wieder. Dies ist der Eingabeknopf:

<asp:ScriptManager runat="server" id="MainScriptManager" /> 
<asp:UpdateProgress runat="server" ID="PageUpdateProgress"> 
    <ProgressTemplate> 
     <img class="ajax-loader" src="/Images/ajax-loader.gif" alt="Loading.." /> 
    </ProgressTemplate> 
</asp:UpdateProgress> 
<asp:UpdatePanel ID="Panel2" runat="server" updatemode="Always"> 
    <Triggers> 
     <asp:AsyncPostBackTrigger controlid="AddToCart" eventname="Click" /> 
    </Triggers> 
    <ContentTemplate> 
     <asp:Button runat="server" OnClick="AddToCart" OnClientClick="hideAddToCart" Text="Add To Cart" class="add-to-cart" ID="AddToCart" name="AddToCart" type="submit" ></asp:Button> 
    </ContentTemplate> 
</asp:UpdatePanel> 

Hier ist der Code hinter hierfür:

protected void AddToCart(object sender, EventArgs e) 
{ 
    // this loads the cart for manipulation 
    Cart cart = Cart.Load(); 

    if (cart.Add("Items")) //this adds items and returns a BOOL for if it succeeded or not 
    { 
     AddToCart.Style.Add("visibility", "visible"); 

    } 
} 

Und hier ist die jQuery für das OnClientClick Attribut

/* We need to hide the "Add To Cart" button when clicked for AJAX purposes */ 
function hideAddToCart() 
{ 
    $(".add-to-cart").css("visibility", "hidden"); 
} 

So funktioniert dies das erste Mal drück den Knopf. Danach hört es auf zu arbeiten. Ich bin mir nicht sicher, was das Problem ist.

Mit der Schaltfläche werden weiterhin Artikel zum Einkaufswagen hinzugefügt, sodass sie über den ersten Klick hinaus funktionieren. Die jQuery feuert nicht nach dem ersten Klick ab.

EDIT

Dies ist, was gemacht wird, bevor ich die Taste zum ersten Mal klicken:

<input type="submit" name="ctl00$MainContent$ItemDetails$ItemDetails$ctl00$ChildItems$ChildItems$FooterTemplate$AddToCart" value="Add To Cart" onclick="hideAddToCart;" id="MainContent_ItemDetails_ItemDetails_ChildItems_0_ChildItems_0_AddToCart" class="add-to-cart"> 

ich es dann klicken:

<input type="submit" name="ctl00$MainContent$ItemDetails$ItemDetails$ctl00$ChildItems$ChildItems$FooterTemplate$AddToCart" value="Add To Cart" onclick="hideAddToCart;" id="MainContent_ItemDetails_ItemDetails_ChildItems_0_ChildItems_0_AddToCart" class="add-to-cart" style="visibility:visible;"> 

Answer 1

Okay, so ich das Problem gelöst . Das OnClientClick erwartet() am Ende meiner Funktion, weshalb das Rendern der Schaltfläche ein Semikolon am Ende des OnClientClick-Attributs hinzugefügt hat.

ASP Button-Code

<asp:Button runat="server" OnClick="AddToCart_Child" OnClientClick="hideAddToCart()" Text="Add To Cart" class="add-to-cart test" ID="AddToCart" name="AddToCart" type="submit" ></asp:Button> 

OnClientClick Bedürfnisse() für den Aufruf von Funktionen.