I. Introduction of JQuery Form
The JQuery form plugin is an excellent AJAX form plug-in that allows you to upgrade HTML forms easily and without intrusion to support Ajax. The JQuery form has two core methods-Ajaxform () and Ajaxsubmit (), which gather functionality from controlling form elements to deciding how to manage the commit process. In addition, plugins include other methods: Formtoarray (), Formserialize (), Fieldserialize (), Fieldvalue (), ClearForm (), Clearfields (), and Resetform () and so on.
JQuery form Plugin allows you to simply upgrade a form submitted in HTML to a form submitted using AJAX technology.
The main method of the plugin, ajaxForm
and ajaxSubmit
the ability to gather information from the form component to determine how to handle the form submission process. Two methods support a wide range of optional parameters, allowing you to fully control the submission of data in the form. This makes the process of submitting a form in Ajax simple and easy to use!
Two
: http://malsup.com/jquery/form/#download
GitHub Home: Https://github.com/malsup/form
NET disk Download: https://yunpan.cn/crjzfmXqaTu9e access password E3BC
Third, information
Online documentation for English: http://www.vaikan.com/docs/jquery.form.plugin/jquery.form.plugin.html
English online Documentation: http://jquery.malsup.com/form/
Iv. examples of simple experiences
1. Write a form on your page. An ordinary form that does not require any special markup:
<form id="MyForm"action="comment.jsp"Method="Post">Name:<input type="text"Name="name"/>Comment:<textarea name="Comment"></textarea> <input type="Submit"Value="Submit Comment"/> </form>
2. Introduce jquery and form Plugin JavaScript script files and add a few simple lines of code to let the page initialize the form after the DOM is loaded:
<script src="jquery-1.3.1.js" type="text/javascript " ></script><script src="jquery.form.js" type="text/ JavaScript"></script>
<form id="MyForm"action="demo.jsp"Method="Post">Name:<input type="text"Name="name"/> <br/>Address:<input type="text"Name="Address"/><br/>Self Introduction:<textarea name="Comment"></textarea> <br/> <input type="Submit"Id="Test"Value="Submit"/> <br/> <div id="OUTPUT1"style="Display:none;"></div> </form>
3. When the form is submitted , the value of address and comment will be forwarded to demo.jsp. If the server side returns a successful status, the user will see a message "Thank you".
<! DOCTYPE HTML Public"-//w3c//dtd HTML 4.01 transitional//en">"Content-type"Content="text/html; Charset=utf-8"/> <script src="Jquery-1.3.1.js"Type="Text/javascript"></script> <script src="Jquery.form.js"Type="Text/javascript"></script> <script type="Text/javascript">$ (document). Ready (function () {$ ('#myForm'). Ajaxform (function () {$ ('#output1'). HTML ("Submit Success! Welcome to come again next time! "). Show (); }); }); </script> 1: The use of the form plugin is--ajaxform (). "MyForm"action="demo.jsp"Method="Post">Name:<input type="text"Name="name"/> <br/>Address:<input type="text"Name="Address"/><br/>Self Introduction:<textarea name="Comment"></textarea> <br/> <input type="Submit"Id="Test"Value="Submit"/> <br/> <div id="OUTPUT1"style="Display:none;"></div> </form> </body>JQuery form Submission Plugin----form Introduction, Official document, official