Simple Example of ajax asynchronous Form Verification in JQuery

In ajax of jquery, there are post and get implementation of several asynchronous forms for submission. Next I will introduce two simple jquery ajax Form Verification instances. I hope they will be helpful to all of you.

$. Get is the same as $. post. The first parameter is the address, the second parameter is the passed value, and the third parameter is the success callback function.
Post method:

The Code is as follows:

Copy code

Function emailb (){ Var email = $ ("# email"). val (); If (email = ""){ $ ("# Inf_email"). replaceWith ('<span id = "inf_email"> <Font color = "red"> Email address cannot be blank </font> </span> '); } Else { $. Post ("/index. php/Index/checkEmail2", {"email": email, "randnum": Math. random () + ''}, function (Res ){ If (res = '1 '){ $ ("# Inf_email"). replaceWith ('<span id = "inf_email"> <Font color = "green"> available </font> </span> '); } Else { $ ("# Inf_email"). replaceWith ('<span id = "inf_email"> <Font color = "red"> '+ res +' </font> </span> '); } }); } }

Get method:

The Code is as follows:

Copy code

Var p = new prompts (); $ ('# Username'). blur (function (){ Var username = $ ('# username'). val (); // get the form value If (username = ''){ P. p ('# user_prompt', 'p1', 'p2 p3', the length of 'uppercase and lowercase English letters, Chinese characters, numbers, and underscores (_) is 3-12 bytes '); C_user = ''; } Else if (username. length <3 ){ P. p ('# user_prompt', 'p2', 'p1 p3', 'incorrect user name length! '); C_user = ''; } Else if (! Validate. username (username )){ P. p ('# user_prompt', 'p2', 'p1 p3', 'this user name is invalid. '); C_user = ''; } Else { // Determine whether the user name exists. ajax is based on jQuery $. Get ("chk_username.php", {username: $ ('# username'). val () }, Function (data, textStatus ){ If (data. indexOf ('true ')! =-1 ){ P. p ('# user_prompt', 'p3 ', 'p1 p2',' congratulations, you can register with this user name! '); C_user = 'yes '; } Else { P. p ('# user_prompt', 'p2', 'p1 p3', 'this user name has been registered. select another user name. '); C_user = ''; } }) } Chkreg (); // verify each mouse exit. Function chkreg (){ If (c_user = 'yes' & c_pwd1 = 'yes' & c_pwd2 = 'yes' & c_email = 'yes' & c_checkcode = 'Yes '){ Flag = true; } Else {flag = false ;} }

Ajax Method

The Code is as follows:

Copy code

<Form action = "/loupan/newask. php" method = "post" id = "submitform" name = "submitform"> <tr> <Td> <table width = "100%" border = "0" cellspacing = "0" cellpadding = "0"> <Tr> <Td width = "6%"> mobile phone: </td> <Td width = "21%"> <input name = "mo" type = "text" class = "Indium" id = "mo" size = "17" /> </Td> <Td width = "8%" align = "right"> Email: </td> <Td width = "21%"> <input name = "email" type = "text" class = "Indium" id = "email" size = "17" /> </Td> <Td width = "44%"> <span class = "gray"> Leave your mobile phone number. We will send the latest message to your mobile phone. </Span> </td> </Tr> </Table> </td> </Tr> <Tr> <Td height = "90" align = "left"> <Textarea name = "bak" cols = "80" rows = "5" class = "lab" id = "bak1"> </textarea> </td> </Tr> <Tr> <Td> <input name = "button" type = "button" class = "but" id = "buttonajax" value = "Submit a message" /> <Span class = "gray"> if you have any questions, you will find a professional real estate consultant or Fang lewang. </Span> </td> </Tr> <Input name = "lid" type = "hidden" value = "5976908"/> <Input name = "cityid" type = "hidden" value = "1208"/> <Input name = "cityareaid" type = "hidden" value = "1209"/> <Input name = "fanginfo" type = "hidden" value = "Yuyang Xihai Plaza"/> </Form> $ ('# Buttonajax'). click (function (){ // Alert ($ (this). val ()); // Checkem (); Var postData = $ ('# submitform'). serialize (); // Alert (postData ); $. Ajax ({ Type: "POST ", Url: "/xxxx. php ", Data: postData, Success: function (msg ){ // Alert (msg ); If (msg = 1 ){ Alert ('your problem has been submitted successfully! '); $ ('# Bak1'). val (''); $ ('# Mo'). val (''); } Else if (msg =-1 ){ Alert ('Your question submission failed. Please fill in the content carefully! '); } Else if (msg =-2 ){ Alert ('Enter the correct mobile phone number! '); } Else if (msg =-3 ){ Alert ('Sorry, the content you submitted contains invalid characters! '); } Else if (msg =-4) { Alert ('Sorry, you have submitted this question. Please do not submit it again! '); } Else { Alert ('Sorry, the system is busy. Please try again later! '); } } }); })