I have trouble with my jquery disabling my linkbutton from clicks after the first click has taken place.

The click should also remove and add some cssStyles.

The problem is no that the linkbutton (anchortag rendered in html) dosent get disabled after the cssStyles has been changed.

After a postback(triggered manually by me) it goes disabled. but that is not something i want. i want it to be a smooth transaction and no postback.

MarkupCode:

<asp:LinkButton ID="LinkButton" runat="server" OnClientClick="" CommandName="Answer" CssClass="linkButton" >
   <asp:Panel ID="PoptionText" runat="server" CssClass="buttonStyle">
      <%# Eval("optionText") %>
      <div>
         <asp:Label ID="lbRätt" runat="server" Visible="false" CssClass="aktiv"></asp:Label>
      </div>
   </asp:Panel>
</asp:LinkButton>

Javascript code:

$(document).ready(function () {
    $("#LinkButton").click(function () {    
        $("#LinkButton").attr("disabled", "disabled"); //this does not happen
        Rightanswer(); // This happens. Function to add remove cssStyles
    })
    $("#LinkButton").click(function (e) {
        if ($("#LinkButton").attr("disabled") == "disabled") {
            e.preventDefault();
        }
    });    
});

I have trouble with my jquery disabling my linkbutton from clicks after the first click has taken place.

The click should also remove and add some cssStyles.

The problem is no that the linkbutton (anchortag rendered in html) dosent get disabled after the cssStyles has been changed.

After a postback(triggered manually by me) it goes disabled. but that is not something i want. i want it to be a smooth transaction and no postback.

MarkupCode:

<asp:LinkButton ID="LinkButton" runat="server" OnClientClick="" CommandName="Answer" CssClass="linkButton" >
   <asp:Panel ID="PoptionText" runat="server" CssClass="buttonStyle">
      <%# Eval("optionText") %>
      <div>
         <asp:Label ID="lbRätt" runat="server" Visible="false" CssClass="aktiv"></asp:Label>
      </div>
   </asp:Panel>
</asp:LinkButton>

Javascript code:

$(document).ready(function () {
    $("#LinkButton").click(function () {    
        $("#LinkButton").attr("disabled", "disabled"); //this does not happen
        Rightanswer(); // This happens. Function to add remove cssStyles
    })
    $("#LinkButton").click(function (e) {
        if ($("#LinkButton").attr("disabled") == "disabled") {
            e.preventDefault();
        }
    });    
});

• jquery
• linkbutton
• javascript

2 Answers 2

You can also try this one out:

$("#<%=LinkButton.ClientID %>").click(function (e) {
   e.preventDefault();
   $(this).attr("disabled", "disabled");
   // Whateverr your code goes here
});

You cant use disabled attribute with anchor tag, only input elements have disabled attribute. You can try something like

$("#LinkButton").click(function (e) {
     if ($("#LinkButton").hasClass(className)) {
        // If have class dont follow href so will work only for first time 
        e.preventDefault();
     }
     Rightanswer(); // Add / Remove class
});      

This might help Should the HTML Anchor Tag Honor the Disabled Attribute?