Jquery form plugin

Jquery form plugin

Form has two core methods: ajaxform () and ajaxsubmit ()

: Http://malsup.com/jquery/form#download

CodeInstance:

< Script SRC = "Jquery. 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 ' Pai.html ( ' Submitted successfully! Come back next time! ' ). Show ();
})
})
// Or
$ ( ' # Myform ' ). Submit ( Function (){
$ ( This ). Ajaxsubmit ( Function (){
$ ( ' # Output1 ' Pai.html ( ' Submitted successfully! Come back next time! ' ). Show ();

});

Return False;//Prevent form submission by default

})

</ Script > < Form ID = "Myform" Action = "Demo. php" Method = "Post" > Name: < Input Type = "Text" Name = "Name" /> < BR /> Address: < Input Type = "Text" Name = "Address" /> < BR /> < Input Type = "Submit" ID = "Test" Value = "Submit" /> < BR /> < Div ID = "Output1" Style = "Display: none ;" > </ Div >

Method Parameters:The parameters of these two methods can be a callback function or an options object.

The callback function is shown in the code.

An options object is defined as follows:

VaR Options = {target: '# output1', // Add the content returned by the server to the element whose ID is output1

Beforsubmit: showrequest, // callback function before submission

Success: showresponse, // callback function after submission

// URL: URL, // It is the form action by default. If declared, it overwrites

// Type: type, // The default value is form's method ('get' or 'post'). If declared

// Datatype: NULL, // 'xml', 'script', or 'json' (accept the type returned by the server .)

// Clearform: True, // after successful submission, clear the values of all form elements.

// Resetform: True, // after successful submission, reset the values of all form elements.

// Timeout: 3000 // request time limit. The request jumps out after 3 seconds .}

 

 

Callback Function showrequest before submission

Function showrequest (Formdata, jqform, options ){

VaR querystring = $. Param (formdata );

Return true ;}

 Formdata: Array object for data submission

 Jqform: A jquery object that encapsulates form elements.

VaR formelement = jqform [0];

VaR address = formelement. Address. value;

In this callback function, as long as no false is returned, the form will be allowedXuSubmission; if false is returned, form submission is blocked. This can be used for form verification before submission.

 

Callback Function showresponse after submission

Function showresponse (responsetext, statustext ){

Alert ('status: '+ statustext +' \ n returns: \ n' + responsetext );

}

Statustext: returns only one status, such as success and error.

Responsetext: contains the data returned by the server.

When XML is returned

 

$ ( ' # Xmlform ' ). Ajaxform ({
Datatype: ' XML ' ,
Success: processxml
});

Function Processxml (responsexml ){
  VaR Name = $ ( ' Name ' , Responsexml). Text ();
  VaR Address = $ ( ' Address ' , Responsexml). Text ();
#( ' # Xmlout ' Pai.html (name +   "   "   + Address );
}