How to solve the problem of two clicks to submit when the button triggers the Ajax request

This article mainly introduces how to solve the problem of two-click submission when the button triggers the Ajax request, which has a certain reference value, and interested friends can refer to it. I hope you will gain a lot after reading this article.

The type of the button on the page is submit:

Ajax's request, in JQuery, is:

(function () {$('# submit') .click (function () {var createGenreForm = $('# createGenreForm'); if (createGenreForm.valid ()) {var obj = {Name: $('# Name'). Val (), Description: $('# Description'). Val ()}; var jsonSerialized = JSON.stringify (obj); $.ajax ({type: "POST", url: createGenreForm.attr ('action'), dataType: "json", contentType: "application/json" Charset=utf-8 ", data: jsonSerialized,success: function (result) {alert (result.Message);}, error: function (error) {alert (" There was an error posting the data to the server: "+ error.responseText);});}});});})

The reason for the two commits is that submit's behavior is not blocked after the ajax request is executed, so there are two solutions:

1. Instead of using a button whose type is submit, use a button whose type is button.

2. In the $('# submit') .click function, add a line of return false;, at the end to block submit.

Thank you for reading this article carefully. I hope the article "how to solve the problem of two-click submission when the button triggers the Ajax request" shared by the editor will be helpful to you. At the same time, I hope you will support us and follow the industry information channel. More related knowledge is waiting for you to learn!