OnclientClick and OnClick not working at the same time?

Question

I have a button like the following,

<asp:Button ID="pagerLeftButton" runat="server" OnClientClick="disable(this)" onclick="pager_Left_Click" Text="<" /> 

When I use my button so onclick does not shoot. When I delete OnClientClick, then onclick starts.

I need to do this, disable the button during the postback and enable it after the postback is complete.

Edit: Additional information:

I added a breakpoint so that my shooting functions are part of C #, and I am debugging, they do not shoot for sure. These features are similar to

 protected void pager_Left_Click(object sender, EventArgs e) { //Do smthing. } protected void pager_Right_Click(object sender, EventArgs e) { //Do smthing. } 

and when I press my button, it turns off for 1-2 seconds and automatically turns on, but I'm not sure why it is turned on. I have not yet added the part to be included.

Answer 1

From this article on web.archive.org :

The trick is to use the OnClientClick and UseSubmitBehavior properties to control the button. There are other methods, including server-side code, to add attributes, but I think the simplicity of this is much more attractive:

 <asp:Button runat="server" ID="BtnSubmit" OnClientClick="this.disabled = true; this.value = 'Submitting...';" UseSubmitBehavior="false" OnClick="BtnSubmit_Click" Text="Submit Me!" /> 

OnClientClick allows you to add the client part of the OnClick script. In this case, JavaScript will disable the button element and change its text value to a progress message. After completion of the postback, the newly created page will return the button to its original state without additional work.

The only error that comes with disabling the submit button on the client side is that it cancels the sending of browsers and thus the postback. Setting the UseSubmitBehavior property to false tells .NET to insert the necessary script client to run postback anyway, rather than relying on browser form presentation behavior. In this case, the code that he enters will be as follows:

 __doPostBack('BtnSubmit','') 

This is added to the end of our OnClientClick code, providing us with this visualized HTML:

 <input type="button" name="BtnSubmit" onclick="this.disabled = true; this.value ='Submitting...';__doPostBack('BtnSubmit','')" value="Submit Me!" id="BtnSubmit" /> 

This gives a nice effect of disabling the button and processing the text, while postback ends.

Answer 2

OnClientClick seems very picky when used with OnClick.

I tried unsuccessfully to use the following use cases:

 OnClientClick="return ValidateSearch();" OnClientClick="if(ValidateSearch()) return true;" OnClientClick="ValidateSearch();" 

But they did not work. The following works:

 <asp:Button ID="keywordSearch" runat="server" Text="Search" TabIndex="1" OnClick="keywordSearch_Click" OnClientClick="if (!ValidateSearch()) { return false;};" /> 

Answer 3

Vinay (above) gave effective work. What actually causes the OnClick event to not work after the OnClientClick event function is that MS detected it where, as soon as the button is disabled (in the function called by the OnClientClick event), the "honors" button does this without trying to terminate the button action by calling OnClick event method.

I struggled for hours trying to figure this out. As soon as I deleted the operator to disable the submit button (which was inside the OnClientClick function), the OnClick method was called without any additional problem.

Microsoft, if you are listening, after clicking a button, it should complete its appointment, even if it is disabled as part of the path of this activity. Until it disconnects when clicked, it must complete all the assigned methods.

Answer 4

There are two problems here:

Disabling a client-side button prevents postback

To overcome this, disable the button after the onclick JavaScript event. An easy way to do this is to use setTimeout as suggested by this answer .

In addition, OnClientClick code OnClientClick executed even if ASP.NET validation fails, so it is probably a good idea to add validation for Page_IsValid . This ensures that the button will not be disabled if the verification fails.

 OnClientClick="(function(button) { setTimeout(function () { if (Page_IsValid) button.disabled = true; }, 0); })(this);" 

Directly put all this JavaScript code in its own function, as the question shows:

 OnClientClick="disable(this);" function disable(button) { setTimeout(function () { if (Page_IsValid) button.disabled = true; }, 0); } 

Disabling a button on the client side does not disable it on the server side

To overcome this, disable the server side button. For example, in the onclick event handler:

 OnClick="Button1_Click" protected void Button1_Click(object sender, EventArgs e) { ((Button)sender).Enabled = false; } 

Finally, keep in mind that preventing duplicate button clicks does not prevent the other two users from sending the same data at the same time. Be sure to consider this on the server side.

Answer 5

What if you don’t immediately turn off the button, but delay it through setTimeout? The disable function will return and sending will continue.

Answer 6

Your JavaScript is fine if you do not have other scripts running on this page that could damage everything. You can verify this using Firebug .

I have already tested a bit, and it actually seems like ASP.net is ignoring disabled controls. In principle, a postback is issued, but the infrastructure probably ignores such events, since it "assumes" that a disabled button cannot raise the postback and therefore ignores, possibly, attached handlers. Now this is just my personal reasoning, you can use Reflector to check it in more detail.

As a solution, you can really try to disable it at a later point, basically you delay the call to control.disabled = "disabled" using JavaTimer or some other functions. Thus, the first postback to the server is issued before the control is disabled by the JavaScript function. Did not test this, but it could work

Answer 7

function UpdateClick (btn) {

  for (i = 0; i < Page_Validators.length; i++) { ValidatorValidate(Page_Validators[i]); if (Page_Validators[i].isvalid == false) return false; } btn.disabled = 'false'; btn.value = 'Please Wait...'; return true; }