Javascript to disable asp.net button

Question

I use the following Javascript to disable a button after click:

var c = 0;
function DisableClick(target) {
    var objName = target;
    document.getElementById(objName).disabled = true;
    c = c + 1;
    msg = 'Please Wait...(' + c + ')!';
    document.getElementById(objName).value = msg;
    var t = setTimeout('DisableClick()', 1000);
}

<asp:Button ID="btnLogin" runat="server" CssClass="cssLoginButton blue"  Text="Log in" ToolTip="Log in" ValidationGroup="UserLogin" onclick="btnLogin_Click" OnClientClick="DisableClick('btnLogin')" />

My Javascript gives this error:

Microsoft JScript runtime error: Unable to set value of the property 'disabled': object is null or undefined

Error Given by script

How can I solve this?

Aristos · Accepted Answer · 2012-11-24 07:19:24Z

1

You can pass the clicked button object in javascript function. Return false if you do not need postback.

Change

OnClientClick="DisableClick('btnLogin')"

To

// the DisableClick make a loop, so make the return here.
OnClientClick="DisableClick(this);return false;" 


function DisableClick(target) {   
    target.disabled = true;
    c = c + 1;
    msg = 'Please Wait...(' + c + ')!';
    target.value = msg;

    // The DisableClick needs the target parametre, so send it again
    //  but need to keep it here for work.
    var me = target;
    var t = setTimeout(function(){DisableClick(me);}, 1000);
}

edited Nov 24, 2012 at 7:19

Aristos

66.7k16 gold badges117 silver badges154 bronze badges

answered Nov 24, 2012 at 6:58

Adil

148k25 gold badges217 silver badges207 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

Aristos Over a year ago

and also must return false, or else is doing post back.

Ajay Over a year ago

Thanks @Aristos i get this error Microsoft JScript runtime error: Unable to set value of the property 'value': object is null or undefined

Adil Over a year ago

You need to change document.getElementById(objName).value = msg; to target.value = msg;

Ajay Over a year ago

@Aristos & Adil yes I disable it for 1 sec. because I mentioned time in my script but after 1 sec I get same error Microsoft JScript runtime error: Unable to set value of the property 'disabled': object is null or undefined

Aristos Over a year ago

@Ajay When is run the SetTimeOut, Adil here forget to give it an argument again, so its not find it.

|

Mihai · Accepted Answer · 2012-11-24 06:54:10Z

0

you could do

OnClientClick = "JavaScript: return false; "

also

document.getElementbyid (objectName)

returns null

are you sure you're passing the correct id of the. button?

answered Nov 24, 2012 at 6:54

Mihai

2,79337 silver badges46 bronze badges

Comments

Smartboy · Accepted Answer · 2012-11-24 06:56:45Z

0

What you can do is call the function on load of the body and it should work fine. So the code will be

<script type="text/javascript">
function disableBtn()
{
var btn= document.getElementById("<%=Button1.ClientID%>");
btn.disabled=true;
}
</script>

Html

<body onload="javascript:disableBtn();">

 <asp:Button ID="Button1" runat="server" Text="Button" />
 ...
 </body>

Hope this will help you !

answered Nov 24, 2012 at 6:56

Smartboy

9946 gold badges24 silver badges37 bronze badges

Comments

MVCKarl · Accepted Answer · 2012-11-24 07:32:41Z

Details: This should solve your solution of Disabling the button as well as displaying a message until the process has finished

Markup

<asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>

 <asp:UpdatePanel ID="UpdatePanel1" runat="server">
     <ContentTemplate>

      .... Your other code

        <asp:Button ID="btnLogin" runat="server" CssClass="cssLoginButton blue"  Text="Log in" ToolTip="Log in"
           OnClientClick="this.disabled=true;" ValidationGroup="UserLogin" onclick="btnLogin_Click"  />

     </ContentTemplate>
</asp:UpdatePanel>

<asp:UpdateProgress ID="UpdateProgress1" runat="server">
        <ProgressTemplate>
            Please Wait...
        </ProgressTemplate>
    </asp:UpdateProgress>

To test it

Code behind

protected void btnLogin_Click(object sender, EventArgs e)
{
   // Introducing delay for demonstration.
   System.Threading.Thread.Sleep(3000);      
}

Collectives™ on Stack Overflow

Javascript to disable asp.net button

4 Answers 4

6 Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

6 Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related