How to restrict user from submitting the form twice?

Question

I have an asp.net form, which allow users to submit a registration form which internally sends/store all these values on SharePoint list using the web-service and hence on submit the page process time is a little lengthier then the normal form.

Mean time before the page gets redirect to a thanks page, user's tend to click the submit button again, which is causing the multipul submission of the same record.

Please suggest a way to restrict this submission, on button click I am using a jquery function for data validation, I have tried using the btn.disable = true method there, but once it reach's the else block (after passing the validation and this is where the disable = true code is) it doesn't submit's the form after reading btn.disable = true statement.

Experts, please show me a path.

Thanks in advance.

Answer 1

See Nathan Long's plugin: https://stackoverflow.com/a/4473801/1414562

{modified to allow re-submit form if an input change}

// jQuery plugin to prevent double submission of forms
jQuery.fn.preventDoubleSubmission = function() {
  var $form = $(this);
  $form.on('submit',function(e){ //on here instead of bind    
    if ($form.data('submitted') === true) {
      // Previously submitted - don't submit again
      e.preventDefault();
    } else {
      // Mark it so that the next submit can be ignored
      $form.data('submitted', true);
    }
  }).find('input').on('change',function(){
       $form.data('submitted',false);
  });

  // Keep chainability
  return this;
};

Use it like this:

$('form').preventDoubleSubmission();

Answer 2

As you've found, if you disable the button in the onclick handler it won't send the request to the server. The simple "hack" to get around this is to, rather than disabling the button right away, use setTimeout to schedule a function to run in, say, 5ms that will disable the button; this will allow the request to be sent to the server before the button is disabled, while not leaving enough time for a person to actually click it twice.

Answer 3

Two ways

Either in Jquery or through C#

Jquery

 $("#btnSubmit").live("click",(function(e) {
    this.disabled = true;
    /Do Something /
  this.disabled = false;
return false;}));

C#

protected void btnSubmitClick(object sender, EventArgs e)
{
btnSubmit.Enabled = false;
/Do Something/
btnSubmit.Enabled = true;
}

Hope this helps

Many Thanks Anna