2017-11-16 13 views
-1

나는 내 양식, 내가 그것을 명중 할 때 onclick을 활성화하고 내가 온 클릭 이 내 버튼이에 언급 한 기능으로 점프 속성에서 검색 버튼을 가지고 <input style="float:right;" type="submit" onclick="getData('search')" id="search" class="btn btn-success" name="searchbtn" value="Search">jQuery Validate plugin을 사용하여 양식이 유효성을 확인할 때까지 제출을 차단하는 방법?

난에 명중 할 때 내가 원하는 검색 버튼 첫 번째 양식 유효성 검사는 그 기능으로 이동하지만, 유효성을 검사하기 전에 직접 그 기능

$('#myForm').validate({ 
    onclick:false, 
     rules:{ 
       name:"required", 
       dob:"required", 
       email:{ 
        required: true, 
        email: true 
       }, 
       age:{ 
        required: true, 
        number: true, 
        minlength:2, 
        maxlength:2 
       } 
       }, 
       messages:{ 
       name: "Please Enter Name", 
       email: "Please Enter valid Email", 
       number: "Please Enter Only Digits", 
       min_length:"Please Enter Minimum 2 Digit", 
       max_length:"Please Enter Maximum 2 Digit" 
       } 
     }); 

이 내 JQuery와 유효성 검사 코드에가는 이유를 모르겠어.

$('#myForm').validate({ 
    .... 
}); 

$('#search').click(function() { 
    //check if form is valid 
    if ($('#myform').valid()) { 
     //call the function 
     getData('search'); 
    } 
}); 
+0

$ ("# myForm을")를 확인 ({ onsubmit : 거짓 }) ; – jeevanswamy21

+0

필요한 모든 것은 설명서에 있습니다. https://jqueryvalidation.org/validate/ – moped

답변

1

가 귀하의 검증 플러그인이로드되지 않을 수 있습니다

<form id="myForm" method="post"> 
       Name:<p><input id="name_search" class="form-control" type="text" name="name" placeholder="name" required></p> 
       Date of Birth:<p><input class="form-control" id="dob_search" type="text" name="dob" placeholder="dd/mm/yy" required></p> 
       Sex:<p> <select id="sex_search" name="sex" class="form-control"> 
        <option value="Male">Male</option> 
        <option value="Female">Female</option> 
          </select></p> 
       Email:<p><input id="mail_search" type="email" class="form-control" name="email" placeholder="Enter your email" required></p> 
       Age: <p><input id="age_search" class="form-control" type="text" name="age" placeholder="Age" required></p><br/> 
       <input style="float:right;" type="submit" onclick="getData('search')" id="search" class="btn btn-success" name="searchbtn" value="Search"></form> 

이 내 양식

0

HTML 마크 업에서 온 클릭 속성을 제거하고 같이 할 것 양식의 유효성을 확인한 후 함수를 호출입니다 . 콘솔에서 오류를 확인하십시오.

또한 getData('search')은 유효성 검사가 통과 된 후에 호출해야합니다.

그리고

<input style="float:right;" type="submit" onclick="getData('search')" id="search" class="btn btn-success" name="searchbtn" value="Search"> 

시도에서

submitHandler: function(form) { 
     getData('search'); 
     }: 

추가하는 onclick="getData('search')" 제거합니다.

$("#myform").validate({ 
    submitHandler: function(form) { 
    getData('search'); 
    } 
});