Mvc+jquery Development B/s System (iii) Form submission

Speaking of form submission, is no one knows, nobody does Xiao Wow. Today we'll talk about how to use JQUERY+MVC to process the submission of forms.

The effect you want to achieve:

1, before submitting the form verification

2. Form Verification

3, after the submission of feedback information

OK, let's talk about the principle of the work first.

The front desk <form action= ' xxx.aspx ' method= ' post ' ></form>,action specifies the processing page that accepts the form. Method Here we only say post

If you submit a form with Ajax, the natural xxx.aspx is the URL of the request. The callback of the AJAX request is the response to the form's submission (error, success), and the feedback we submit is expressed in a floating layer (lightbox). Not to use alert (""); This is a very awkward clang.

We introduce a jquery plugin http://www.malsup.com/jquery/form/#api This is a slightly famous plugin that is easy to use.

For its use, you can search for the next.

So what we need to do is

1, the use of jquery.form.js

2, the realization of Lightbox

3. How to verify

Code

Registering the form's Ajaxform this method requires calling the Jquery.ajaxwindow.js method
There is an action in the general form, so the parameter may only need to pass a callback,
If a form has multiple submit buttons, you need to submit a different URL
This method is used to register form submission, if there are multiple submit buttons, it is best to register a default, otherwise the validation method does not work
$.fn.submitform = function (args) {
var URL, id, callback, before;
id = this.attr ("id");

if (typeof (args) = = "string") {//Only one URL is passed
url = args;
before = undefined;
callback = undefined;
}
else {
args = args | | New Object ();
url = Args.url | | This.attr ("action");
if (typeof (args) = = "function") {//Only one callback
callback = args;
}
else {
before = Args.before;
callback = Args.callback;
}
}
Input validation
This.inputvalidate ()//This is an "input-time validation" that we need to implement.
This.ajaxform ({//) call the Jquery.form.js form registration method here.
Url:url,
Beforesubmit:function (A, F, O) {//Pre-submission processing
Submit Validation
if ($ ("#" + ID). submitvalidate () = = false)//Here we need to implement the "Commit time validation".
return false;
if (before!= undefined && before () = = False) {
return false;
}
O.datatype = "json";//Specifies that the returned data is in JSON format.
},

Success:function (data) {//post-submission feedback processing
if (data = = "" | | data = = NULL) {
return false;
}
var msg = new ajaxmsg (data);//This ajaxmsg is what we need to achieve Lightbox
Msg.show (callback);//show The result of this feedback.
return false;
}
});
return this;
}