jquery submits form forms asynchronously
This is actually quite simple, just at the beginning I think wrong, at first I intend to use jquery + Jquery.form plug-in to do, in fact, do not need, only the JQuery plugin can be.
First, you import jquery into the JSP page,
<script type= "Text/javascript" src= "<%=request.getcontextpath ()%>/js/jquery-1.4.2.js" ></script >
Then, in the Ready method of jquery, you define the action of the form submission,
$ (document). Ready (function () {
Submit a form asynchronously using JQuery
$ (' #editRealMsgForm '). Submit (function () {
Jquery.ajax ({
URL: ' Editrealmsg.eri ',
Data: $ (' #editRealMsgForm '). Serialize (),
Type: "POST",
Beforesend:function ()
{
$ (' #submitButton '). Hide ();
$ (' #editRealMsgImg '). Show ();
},
Success:function ()
{
$ (' #editRealMsgImg '). Hide ();
$ (' #modifyButton '). Show ();
$ (' #realName '). attr ("Disabled", "true");
$ (' #tel '). attr ("Disabled", "true");
}
});
return false;
});
});
Now this form binds to the asynchronous commit method of the jquery package, which is simple.
=====================================================
The second method
No input ID
=======================================================
jquery to submit to form form (MVC scheme)
jquery to submit to form form, here is a form form, there is no action field, we can register the event with jquery to submit,
<form method= "POST" id= "DocumentForm" >
<input type= "hidden" id= "Hidid" name= "Hidid" value= "<%=request.querystring[" id "]%>"/>
<input type= "hidden" id= "hidaction" name= "hidaction" value= "<%=request.querystring[" action "]%>"/>
<div class= "Fieldbody" >
<div class= "Tagsiglebody" >
<table class= "Create" >
<tr>
<th class= "W100" >
Key words:
</th>
<TD class= "NES" >
<input type= "text" id= "Txtkeyword" name= "Txtkeyword" class= "txt w250" value= "<%= viewdata.eval_r (" keywords ")% > "
Isnull= "0"/>
Please separate the keywords with commas
</td>
</tr>
</table>
</div>
</div>
<div class= "Btngroup" >
<input type= "button" class= "Btncreateok" id= "btnconfirm" value= "create"/>
<input type= "button" class= "Btncreatecancel" onclick= "History.go ( -1)" value= "Cancel"/>
</div>
</form>
The code in JS is as follows:
$ (document). Ready (function () {
$ ("#btnConfirm"). Click (function () {
$ (' #documentForm '). SubmitForm ({
URL: "/document/submitdocumentcreate",
DataType: "Text",
Callback:function (data) {
Endfileupload ();
data = Eval_r ("(" + Data + ")");
Alert (data. Content);
if (data. Result > 0) {
Location.href = data. Redirect;
}
},
Before:function () {
Startfileupload ();
var errmsg = "";
}
}). Submit ();
});
}
In JS, we must note that $ (document). Ready is required, otherwise it will be an error, with the event binding of the button, the ID of the form: $ ("#btnConfirm"). Click, $ (' #documentForm '). SubmitForm
The URL and callback method are then given in the $ (' #documentForm '). SubmitForm method.
Well, this is done, of course, how to get the value of the form in Document/submitdocumentcreate, with request.form["xxxxx", you can get the value of the form.
