I am trying to disable a linkbutton but no luck! I tried every possible solution, However I can not limit users click on that link button. End users should not be able to click the link button more than one. One click and that is it! Button must go right away! How can I achieve this? My button is on ModalPopupExtender and it is a Make Payment button so image the user click that button more than one makes multiple payments.

My solutions were similar to this:

function returnFalse() {
     return false;
}
   
function disableLinkButton(clientID) {
     document.getElementById(clientID).disabled = "disabled";
     document.getElementById(clientID).onclick = returnFalse;
}

I am trying to disable a linkbutton but no luck! I tried every possible solution, However I can not limit users click on that link button. End users should not be able to click the link button more than one. One click and that is it! Button must go right away! How can I achieve this? My button is on ModalPopupExtender and it is a Make Payment button so image the user click that button more than one makes multiple payments.

My solutions were similar to this:

function returnFalse() {
     return false;
}
   
function disableLinkButton(clientID) {
     document.getElementById(clientID).disabled = "disabled";
     document.getElementById(clientID).onclick = returnFalse;
}

• javascript
• asp

• 2 how about just simply remove / hide the button? – Tobias Krogh Commented Apr 24, 2012 at 11:05
• DUP : stackoverflow./questions/9682833/… and stackoverflow./questions/754497/… – PresleyDias Commented Apr 24, 2012 at 11:07
• @TobiasKrogh, that works but after postback. what if your page sends large amount of data and user clicks the button more than once while page is submitting? – Cute Bear Commented Dec 4, 2012 at 16:50

5 Answers 5

Thought I'd throw my solution out there:

$('a.btn').click(function() {
    var self = $(this);
    setTimeout(function() { self.attr('href', 'javascript:void(0);'); }, 10);
    return true;
});

This worked fine for me in IE10, but I can't see why it wouldn't work in older versions too.

If you're using async postbacks and your UpdatePanel's also contain buttons that you don't want users rage clicking, below was my solution seeing as the jQuery 'live' function doesn't work:

$(function() {
    function bindButtonDisabler() {
        $('a.btn').click(function() {
            var self = $(this);
            setTimeout(function() { self.attr('href', 'javascript:void(0);'); }, 10);
            return true;
        });
    }

    bindButtonDisabler(); // Initial bind on DOM ready.

    $(window).load(function() { // Ensure re-bind after postback (optional)
        Sys.WebForms.PageRequestManager.getInstance().add_endRequest(bindButtonDisabler);
    });
});

Hope someone finds it useful :)

Returning false should work. Try this:

function disableLinkButton(clientID) {
 document.getElementById(clientID).disabled = "disabled";
 document.getElementById(clientID).onclick = return returnFalse;
}  

You could try something like this, to give you an idea:

document.getElementById(clientID).onclick = function() {
   /* process payment */
   this.onclick = function(){};
}

Want some thing like this.

  document.getElementById(clientID).setAttribute("disabled", "true");

You can do this like this:

function disableLink(id) {
   document.all[id].removeAttribute('href');
}​

HTML:

<a id='link1' href="javascript:disableLink('link1');">Click me</a>

(or) try this:

 document.getElementById("#<%=LinkButton.ClientID%>").attr("disabled", true);