OnclientClick and OnClick is not working at the same time

Question

I have a button like the following    lt asp Button ID  pagerLeftButton  runat  server  OnClientClick  disable this   onclick  pager Left Click  Text   lt     gt    When I use my button like that  onclick is not firing  When I remove OnClientClick  then onclick is firing    What I need to do is  disable the button during the postback and enable it after the postback ends   Edit   Additional information    I added break point to my firing functions is c  part and I am debugging  they are not firing for sure  Those functions are like  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 click my button  it is disabled for 1-2 seconds and automatically enabled  but I am not sure why it is enabled  I didn t add any part for it to be enabled again

User · Accepted Answer

From this article on web archive org    The trick is to use the OnClientClick and UseSubmitBehavior properties of the button control  There are other methods  involving code on the server side to add attributes  but I think the simplicity of doing it this way is much more attractive   lt asp Button runat  quot server quot  ID  quot BtnSubmit quot   OnClientClick  quot this disabled   true  this value    Submitting      quot    UseSubmitBehavior  quot false quot   OnClick  quot BtnSubmit Click quot   Text  quot Submit Me  quot    gt   OnClientClick allows you to add client side OnClick script  In this case  the JavaScript will disable the button element and change its text value to a progress message  When the postback completes  the newly rendered page will revert the button back its initial state without any additional work  The one pitfall that comes with disabling a submit button on the client side is that it will cancel the browser   s submit  and thus the postback  Setting the UseSubmitBehavior property to false tells  NET to inject the necessary client script to fire the postback anyway  instead of relying on the browser   s form submission behavior  In this case  the code it injects would be    doPostBack  BtnSubmit       This is added to the end of our OnClientClick code  giving us this rendered HTML   lt input type  quot button quot  name  quot BtnSubmit quot   onclick  quot this disabled   true  this value   Submitting       doPostBack  BtnSubmit      quot   value  quot Submit Me  quot  id  quot BtnSubmit quot    gt   This gives a nice button disable effect and processing text  while the postback completes

User · Answer

What if you don t immediately set the button to disabled  but delay that through setTimeout  Your  disable  function would return and the submit would continue

User · Answer

function UpdateClick btn         for  i   0  i  lt  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

User · Answer

There are two issues here   Disabling the button on the client side prevents the postback  To overcome this  disable the button after the JavaScript onclick event  An easy way to  do this is to use setTimeout as suggested by this answer   Also  the OnClientClick code runs even if ASP NET validation fails  so it s probably a good idea to add a check for Page IsValid  This ensures that the button will not be disabled if validation fails   OnClientClick   function button    setTimeout function      if  Page IsValid  button disabled   true     0      this      It s neater to put all of 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 the button on the client side doesn t disable it on the server side  To overcome this  disable the button on the server side  For example  in the OnClick event handler   OnClick  Button1 Click   protected void Button1 Click object sender  EventArgs e          Button sender  Enabled   false      Lastly  keep in mind that preventing duplicate button presses doesn t prevent two different users from submitting the same data at the same time  Make sure to account for that on the server side

User · Answer

Your JavaScript is fine  unless you have other scripts running on this page which may corrupt everything  You may check this using Firebug   I ve now tested a bit and it really seems that ASP net ignores disabled controls  Basically the postback is issued  but probably the framework ignores such events since it  assumes  that a disabled button cannot raise any postback and so it ignores possibly attached handlers  Now this is just my personal reasoning  one could use Reflector to check this in more depth   As a solution you could really try to do the disabling at a later point  basically you delay the control disabled    disabled  call using a JavaTimer or some other functionality  In this way 1st the postback to the server is issued before the control is being disabled by the JavaScript function  Didn t test this but it could work

User · Answer

OnClientClick seems to be very picky when used with OnClick    I tried unsuccessfully with the following use cases   OnClientClick  return ValidateSearch      OnClientClick  if ValidateSearch    return true   OnClientClick  ValidateSearch       But they did not work  The following worked    lt asp Button ID  keywordSearch  runat  server  Text  Search  TabIndex  1     OnClick  keywordSearch Click     OnClientClick  if   ValidateSearch      return false       gt

User · Answer

Vinay  above  gave an effective work-around   What s actually causing the button s OnClick event to not work following the OnClientClick event function is that MS has defined it where  once the button is disabled  in the function called by the OnClientClick event   the button  honors  this by not trying to complete the button s activity by calling the OnClick event s defined method     I struggled several hours trying to figure this out   Once I removed the statement to disable the submit button  that was inside the OnClientClick function   the OnClick method was called with no further problem   Microsoft  if you re listening  once the button is clicked it should complete it s assigned activity even if it is disabled part of the way through this activity   As long as it is not disabled when it is clicked  it should complete all assigned methods

[c#] OnclientClick and OnClick is not working at the same time?

Examples related to c#

Examples related to asp.net

Examples related to postback

Examples related to onclick

Examples related to onclientclick