How to disable link button after click (no JQuery)

Question

I want to disable link button after user click on it.
But I made something wrong here.

Button is still enabled after click. What am I doing wrong?

<asp:LinkButton ID="submit" runat="server" 
        CssClass="button" 
        Text="OK" 
        OnClick="Submit_Click" 
        OnClientClick="this.disabled=true">
</asp:LinkButton>

Answer 1

Just give return false; to your JavaScript. The reason is that your asp:LinkButton is getting rendered like this.

<a href="javascript:__doPostBack('ctl00$ContentPlaceHolder1$submit','')" 
   class="button" 
   id="ContentPlaceHolder1_submit" 
   onclick="this.disabled = true;return false;">
OK</a>

So, if you do not give return false, these things happens

1. It fires the onclick event and disables the anchor tag. (anchor tag does not have a disabled property. button and input type="submit" has that property.)
2. It moves on to fire the postback and hits the server side click event
3. As there is a postback, the client side JavaScript disabling wont persist (even if it were a button)

By enforcing return false you are asking the asp:LinkButton not to do anymore processing.

P.S: I have been using PostBack Ritalin to prevent multiple clicks on asp:Button. IMO, its definitely worth a look in this case.

Answer 2

Use the javascript debugger to check the method is being called. LinkButtons are server generated javascript powered anchor tags & therefore can be tricky.

Answer 3

Try this java script function ,

On your OnClientClick

    <asp:LinkButton  ID="submit" CssClass="button"  Text="OK" onclick="myButtonId_Click(this);return false;" ></asp:LinkButton>

add function ,

    protected void myButtonId_Click(target) {
     target.disabled = true;
    }