Using jquery to prevent form submission

Question

I use jquery.submit () to catch the user send event, however I found a problem.

When the user clicks the submit button, the form is usually submitted, but if the user intentionally quickly clicks it several times, he will submit several times, which will lead to duplication of data in the database.

What is the solution for this kind of problem?

Update: Well, I see some of the tips say disabling the submit button. This should prevent the form from being submitted several times, but the problem is that the form element on my page does not refresh, if I turn it off, the user can no longer send it by turning it off for 15 seconds, it may work, but this is the right way to solve this problem ?

Answer 1

Disabling the submit button is really the way to go.

, , - . MVC , MS ASP.NET Sun JSF, "" , . - , . , , - .

:

• setTimeout(), , - . 50 - .

  $("form").submit(function() {
      var form = this;
      setTimeout(function() {
          $(':submit', form).attr('disabled', true);
      }, 50);
  });
  

• - . , submit <form>. $(document) , .

  $("form").submit(function() {
      $(':submit', this).attr('disabled', true);
      $(this).append($('<input/>').attr({
          type: 'hidden',
          name: $.lastClicked.name,
          value: $.lastClicked.value
      }));
  });
  
  $(document).click(function(e) {
      e = e || event;
      $.lastClicked = e.target || e.srcElement;
  });
  

---

: :

, , . , , , , , 15 , , ?

, . jQuery ajax. , jQuery.post:

$("form").submit(function() {
    // Disable buttons here whatever way you want.

    var form = this;
    $.post('some/url', function(data) {
        // Re-enable buttons at end of the callback handler.
        $(':submit', form).attr('disabled', false);
    });
});

Answer 2

"" jQuery.

http://jquery-howto.blogspot.com/2009/05/disable-submit-button-on-form-submit.html

Answer 3

submit....

$("form").submit(function() {
    $(':submit',this).attr('disabled','disabled');
    $('selector').load(url,function(){
       $(':submit',this).removeAttr('disabled');
    })
});​

Answer 4

, . , :

, GUID. , . viewstate. , , , OngoingOperations, . , . , , .

OngoingOperations :

CREATE TABLE OngoingOperations ( ID, OperationDate datetime default getdate(), OperationStatus nvarchar (max) );

OperationStatus - . (ok ) - .

This table requires a collection of old records, say, every hour you simply delete operations with completed 2 or more hours earlier.

Anton Burtsev

Answer 5

Try the following:

$("form").submit(function() {
    var form = this;
    setTimeout(function() {
        $(':submit', form).attr('disabled', true);
    }, 50);

    setTimeout(function() {
        $(':submit', form).removeAttr('disabled');
    }, 1000);
});