jquery submits form forms using Ajax via the Jquery.form.js plugin

Source: Internet
Author: User

I used it briefly, thejQuery form plugin has some advantages:
1. Support Pre-submission verification.
2. Support post-commit callbacks.
3. Use Ajax to have a good user experience
4. The submission method is flexible. Simply specify the form ID you want to submit. You want to submit the form. You can submit that. The submit parameter is configurable.
5. Support for submitting multiple types of data. such as: Xml,json.
The main functions:
1.ajaxForm
Add all the required event listeners to prepare for the AJAX submission form. Ajaxform cannot submit the form. In the ready function of document, use Ajaxform to prepare the form for the Ajax submission . A ajaxform accepts 0 or 1 parameters. This single parameter can be either a callback function or an options object.
Instance:

$ (' #myFormId '). Ajaxform ();


2.ajaxSubmit
The form is immediately submitted by Ajax. In most cases, ajaxsubmit is called to respond to a user submitting a form. A ajaxsubmit accepts 0 or 1 parameters. This single parameter can be either a callback function or an options object.
Instance:

The binding form submits the event handler $ (' #myFormId '). Submit (function () {//Submit form $ (this). Ajaxsubmit ();//To prevent regular browsers from making form submissions and generating page navigation ( prevent page refreshes ? ) returns Falsereturn false;});

3.formSerialize
Serialize (or serializes) the form into a query string. This method returns a string in the following format: Name1=value1&name2=value2. This method returns a string.
Instance:

var queryString = $ (' #myFormId '). Formserialize ();//You can now submit data $.ajax (' $.post ') using $.get, $.post, myscript.php, etc. queryString);

4.fieldSerialize
Serializes (or serialize) a form's field elements into a single query string. This is handy when only a subset of the form fields need to be serialized (or serializable). This method returns a string in the following format: Name1=value1&name2=value2. This method returns a string.
Instance:

var queryString = $ (' #myFormId. Specialfields '). Fieldserialize ();


5.fieldValue
Returns the value of the form element that matches the inserted array. Starting with version 0.91, the method will always return data as an array. If the element value is judged to be invalid, the array is empty, otherwise it will contain one or more element values. The method returns an array.
Instance:

Get password input value var = $ (' #myFormId:p assword '). Fieldvalue (); Alert (' The password is: ' + value[0]);

6.resetForm
Restores the form to its original state by invoking the original Dom method of the form element.
Instance:

$ (' #myFormId '). Resetform ();

7.clearForm
Clears the form element. This method empties all text (text) input fields, password (password) input fields, and text area (textarea) fields, clearing the selection in any select element . and resets all the Radio (radio) buttons and the multi-select (checkbox) buttons to unselected states.
Instance:

$ (' #myFormId '). ClearForm ();

8.clearFields
Clears the field element. Easy to use only if some form elements need to be cleared.
Instance:

$ (' #myFormId. Specialfields '). Clearfields ();

A simple example of the JQuery form plugin:

<%@ page language= "java" pageencoding= "UTF-8"%><! DOCTYPE HTML PUBLIC "-//w3c//dtd HTML 4.01 transitional//en" >

JQuery submits form forms using AJAX via Jquery.form.js plug-ins

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.