양식을 보낸 후 jQuery 유효성 검사가 실행되는 이유는 무엇입니까?

Question

jQuery 유효성 검사 플러그인을 사용하여이 양식의 유효성을 검사하려고 시도하지만 일단 오류를 찾으면 JavaScript 코드가 중지되지 않으므로 양식이 DB로 전송 된 다음 오류 만 표시됩니다. 이러한 이벤트를 제대로 연결하려면 어떻게해야합니까?

$("#salvar-cur").live("click", function() { 
    var validator = $("#frm_curriculo").validate({ 
     rules: { 
      cur_nome: { 
       required: true 
      } 
      //other options 
     }, 
     messages: { 
      cur_nome: { 
       required: "*" 
      } 
      //other options 
     } 
    }); 
    if (validator.numberOfInvalids() == 0) { 
     alert("Success!") 
     var params = $("#frm_curriculo").serialize(); 
     $.ajax({ 
      type: "POST", 
      url: "controller/ctrl_curriculo.php", 
      data: "acao=inserir&" + params, 
      dataType: "html", 
      contentType: "application/x-www-form-urlencoded", 
      success: function() { 
       $("#frm_curriculo")[0].reset(); 
      } 
     }); 
    } 
}); 

Answer 1

먼저 해제는, 당신은 다시 추가하는 각 클릭에 대한 검증을. 이벤트 처리기 외부에서 실제로 그렇게해야합니다.

또한, 대신 validator.numberOfInvalids()을 점검, $("#frm_curriculo").valid()를 확인해보십시오,이 양식을 확인하고 true 또는 false를 반환합니다.

#salvar-cur이 제출 버튼이라면 다른 기본 동작을 방지하고 싶을 것입니다.

$(function(){ 
    $("#frm_curriculo").validate({ 
     rules: { 
      cur_nome: { 
       required: true 
      } 
      //other options 
     }, 
     messages: { 
      cur_nome: { 
       required: "*" 
      } 
      //other options 
     } 
    }); 
}); 

$("#salvar-cur").live("click", function (e) { 
    e.preventDefault(); 
    if ($("#frm_curriculo").valid()) { 
     alert("Success!") 
     var params = $("#frm_curriculo").serialize(); 
     $.ajax({ 
      type: "POST", 
      url: "controller/ctrl_curriculo.php", 
      data: "acao=inserir&" + params, 
      dataType: "html", 
      contentType: "application/x-www-form-urlencoded", 
      success: function() { 
       $("#frm_curriculo")[0].reset(); 
      } 
     }); 
    } 
});