After the jqueryvalidate and jqueryform plug-ins are combined to verify the form, AJAX submits _ jquery

In the popular ajax era, it seems that we seldom see the traditional synchronous form submission method. Of course, we must use more powerful AJAX to Implement Asynchronous and no-refreshing forms, let's get started with jQuery today. Let's use jquery today. validate and jquery. form plug-ins are combined to implement AJAX submission after the verification form is implemented. If you need a friend, you can refer to the two useful plug-ins of jQuery -- jquery validate. js and jquery form. js. the details are described below.

1. jQuery validate. jsTo put it bluntly, it is a very noble person who has written various forms for us to verify. Instead of writing these kids shoes, it's so tired every day.

2. jQuery form. js"This plug-in allows you to easily upgrade forms submitted in HTML form to forms submitted using AJAX technology. The main methods in the plug-in are ajaxForm and ajaxSubmit, which can collect information from the form component to determine how to process the form submission process. Both methods support many optional parameters, allowing you to completely control the submission of data in the form. This makes the process of submitting a form in AJAX mode simple and not easy! ".

See the sample code below:

Form:

Javascript:

$(document).ready(function () { $("#AddColumnsForm").validate({ submitHandler: function(form) {  $(form).ajaxSubmit(); } });});

I will try again later

$ (Document ). ready (function () {$ ("# AddColumnsForm "). validate ({submitHandler: function (form) {$ (form ). ajaxSubmit ({success: function (result) {// update the data displayed on the page after the form is submitted $ ('# treetable '). treegrid ('reload'); var d = result. split (';'); ShowMsg (d [0], d [1], d [2]) ;}}) ;});

Then, modify the display location of the error message to conform to the bootstrap style.

$ (Document ). ready (function () {$ ("# AddColumnsForm "). validate ({errorPlacement: function (error, element) {// display operation of custom error information. element is the input control with an error, and error can be considered to contain

Label of the error message

  element.next('span.help-block').remove();  element.after('' + error.text() + '');  element.parent().addClass("has-error"); },submitHandler: function(form) {  $(form).ajaxSubmit({  success: function (result) {   $('#TreeTable').treegrid('reload');   var d = result.split(';');   ShowMsg(d[0], d[1], d[2]);  }  }); } });

The above content introduces the combination of jquery. validate and jquery. form plug-ins for AJAX submission after verification form is implemented. If this article is not well written, please forgive me. Thank you.