Jquery.validate do not use the submit submission to submit with the button and verify the user name using Ajax

JavaScript section:

$(function() {    //Form Validation$ ("#addUserInfo"). Validate ({rules: {username : {required:true, minlength:2,                //Asynchronous validation beginsremote: {URL:"Usermanage/username.validate",//URL address of the sending requestType: "Post",//Request MethodDataType: "JSON",//type of data receiveddata: {username:function () {                            return$ ("#username"). Val (); }}, Datafilter:function(data, type) {//Filter Back Results                        if(data = = "true")                            return true;//True indicates that the user name does not yet exist                        Else                          return false;//False indicates that the user name already exists                    }                }                //end of asynchronous validation}, Password: {required:true, minlength:5}, ConfirmPassword: {required:true, minlength:5, Equalto:"#password"}, Mobile: {required:true, minlength:5, },}, messages: {username: {required:"Please enter user name", minlength:"User name must consist of two letters", Remote:"The user name entered already exists"}, Password: {required:"Please enter your password", minlength:"Password length cannot be less than 5 letters"}, ConfirmPassword: {required:"Please enter your password", minlength:"Password length cannot be less than 5 letters", Equalto:"Two input passwords inconsistent"}, Mobile: {required:"Please enter your phone number", minlength:"Mobile phone number cannot be less than 5 letters"            },        }    });} );/** * Add user Information*/functionAddUser () {varFlag = $ ("#addUserInfo"). valid (); if(!flag) {        //failed to pass validation        return; }    varData = $ ("#addUserInfo"). SerializeObject (); $.ajax ({secureuri:false,//whether a security protocol is required, generally set to falseFileelementid: ' File_path ', type:"POST", DataType:' JSON ', Data:data, url:"Usermanage/adduser.do", Success:function(JSON) {alert (json.message); $("#addUserInfo input[name= ' username ')". Val (""); $("#addUserInfo input[name= ' password ')". Val (""); $("#addUserInfo input[name= ' ConfirmPassword ')". Val (""); $("#addUserInfo input[name= ' Mobile]"). Val (""); if(json.success) {Datatable1.draw (); }        }    });}

HTML section:

<Divclass= "box Box-primary"style= "width:30%;">    <Divclass= "Box-header with-border">        <H3class= "Box-title">New User Information</H3>    </Div>    <formrole= "form"ID= "Adduserinfo">        <Divclass= "Box-body">            <Divclass= "Form-group">                <label for= "username">Name</label>                <inputtype= "text"class= "Form-control"ID= "username"name= "username"placeholder= "Enter username" />            </Div>            <Divclass= "Form-group">                <label for= "Password">Password</label>                <inputtype= "Password"class= "Form-control"ID= "Password"name= "Password"placeholder= "Password" />            </Div>            <Divclass= "Form-group">                <label for= "ConfirmPassword">Enter the password again</label>                <inputtype= "Password"class= "Form-control"ID= "ConfirmPassword"name= "ConfirmPassword"placeholder= "Confirm Password" />            </Div>            <Divclass= "Form-group">                <label for= "mobile">Phone</label>                <inputtype= "text"class= "Form-control"ID= "mobile"name= "mobile"placeholder= "Mobile" />            </Div>        </Div>        <Divclass= "Box-footer">            <Buttontype= "button"onclick= "AddUser ()"class= "Btn btn-primary">New</Button>            <Buttontype= "Reset"class= "Btn btn-primary">Reset</Button>        </Div>    </form></Div>

Jquery.validate do not use the submit submission to submit with the button and verify the user name using Ajax