Home > Developer > Web Develop
Jquery.validate.js Plugin Application example, Ajax way to submit data.
HTML code:
<!DOCTYPE HTML Public "-//W3C//DTD XHTML 1.0 transitional//en" "http://www.w3.org/TR/xhtml1/DTD/ Xhtml1-transitional.dtd "><HTMLxmlns= "http://www.w3.org/1999/xhtml"><Head><Metahttp-equiv= "Content-type"content= "text/html; charset=utf-8" /><title>Jquery.valisdate.js Learning</title><styletype= "Text/css">TABLE,TD{Border:0}. Error,.myerror{Color:#933;}</style></Head><Body><formID= "Commentform" > <Table> <TR> <TD><label for= "username">Account number (required, at least 2 characters)</label></TD> <TD> <inputID= "username"name= "username"type= "text" /> </TD> </TR> <TR> <TD>e-mail (required)</TD> <TD> <inputID= "Email"type= "Email"name= "Email" /> </TD> </TR> <TR> <TDcolspan= "2"><inputclass= "Submit"type= "Submit"value= "Submit"/></TD> </TR> </Table></form><Scriptsrc= "Jquery-1.11.1.js"></Script><Scriptsrc= "Jquery.validate.min.js"></Script><Script>$("#commentForm"). Validate ({rules:{username:{required:true}, email:{required:true, Email:true}}, messages:{username:"Please enter user name", email:{required:"Please enter your email", Email:"Bad mailbox Format" } }, //Ajax Way to submitSubmithandler:function(form) {$.ajax ({type:"Post", URL:"check.php", data:{username:$ ("#username"). Val (), email:$ ("#email"). Val (),}, Success:function(data) {if(Data== 'true') {alert ('Registration Successful! '); }Else{alert ('user name is already occupied! '); } } }); } });//This code can be encapsulated in a separate JS file, and then introduced toJquery.extend (jQuery.validator.messages, {required:"Required Fields", Remote:"Please fix this field", Email:"Please enter an email in the correct format", URL:"Please enter a valid URL", Date:"Please enter a valid date", Dateiso:"Please enter a valid date (ISO).", Number:"Please enter a valid number", digits:"only integers can be entered", CreditCard:"Please enter a valid credit card number", Equalto:"Please enter the same value again", Accept:"Please enter a string with a valid suffix name", Maxlength:jQuery.validator.format ("Please enter a string with a maximum length of {0}"), Minlength:jQuery.validator.format ("Please enter a string with a minimum length of {0}"), Rangelength:jQuery.validator.format ("Please enter a string between {0} and {1} in length"), Range:jQuery.validator.format ("Please enter a value between {0} and {1}"), Max:jQuery.validator.format ("Please enter a value of max {0}"), Min:jQuery.validator.format ("Please enter a value with a minimum of {0}")});</Script></Body></HTML>
PHP Handler code:
<? PHP $username $_post [' username ']; $email $_post [' email ']; if ($username = = ' user001 ') {echo ' false ';} Else { echo ' true '; }When the user name is entered user001, the user name is indicated to be occupied.
Article turned from: http://www.zf-bbs.com/viewtopic.php?f=21&t=23
Form validation Artifact--jquery.validate plugin
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
