2012-07-06 4 views
9

기존 폼을 hijaxing하고 서버에 게시 중입니다. jQuery validate는 대부분의 유효성 검사를 수행하지만 서버에서 유효성 검사가 실패하면 JSON으로 클라이언트에 오류를 반환합니다.jquery의 오류를 확인하는 방법

<script type="text/javascript"> 

    $(function() { 

     $("form").submit(function (e) { 
      var $form = $(this); 
      var validator = $form.data("validator"); 

      if (!validator || !$form.valid()) 
       return; 

      e.preventDefault(); 

      $.ajax({ 
       url: "@Url.Action("index")", 
       type: "POST", 
       data: $form.serialize(), 
       statusCode: { 
        400: function(xhr, status, err) {       
         var errors = $.parseJSON(err); 
         validator.showErrors(errors); 
        } 
       }, 
       success: function() { 
        // clear errors 
        // validator.resetForm(); 
        // just reload the page for now 
        location.reload(true); 
       } 
      }); 
     }); 

    }); 

</script> 

문제는 내가 POST가 성공하면 유효성 검사 오류를 취소 할 수없는 것입니다 : 아래

는 것을 수행하는 코드이다. validator.resetForm()을 호출 해 보았습니다.하지만 차이는 없습니다. showError() 호출로 추가 된 오류 메시지는 계속 표시됩니다.

참고 jQuery.validate.unobtrusive 플러그인도 사용하고 있습니다.

+0

당신은 전체 코드를 게시하시기 바랍니다 수 있습니까? –

+0

너무 많지는 않지만 어쨌든 전체 스크립트를 게시했습니다. –

+0

그냥이 라인이 효과가 있습니까? validator.showErrors (errors); –

답변

29

잠시 전에 게시했는데 해결할 수 있는지 잘 모르겠습니까? jQuery 유효성 검사 및 jQuery.validate.unobtrusive 플러그인과 동일한 문제가있었습니다.

소스 코드와 일부 디버깅을 검토 한 결과, 눈에 잘 띄지 않는 플러그인이 오류 메시지를 처리하는 방식에서 문제가 발생했다고 결론을 냈습니다. 플러그인이 설정되어있는 errorClass을 제거하므로 양식을 재설정하면 jQuery 유효성 검사에서 제거 할 오류 레이블을 찾을 수 없습니다.

내가 플러그인의 코드를 수정하고 싶지 않았다, 그래서 나는 다음과 같은 방법으로이를 극복 할 수 있었다 :

// get the form inside we are working - change selector to your form as needed 
var $form = $("form"); 

// get validator object 
var $validator = $form.validate(); 

// get errors that were created using jQuery.validate.unobtrusive 
var $errors = $form.find(".field-validation-error span"); 

// trick unobtrusive to think the elements were succesfully validated 
// this removes the validation messages 
$errors.each(function(){ $validator.settings.success($(this)); }) 

// clear errors from validation 
$validator.resetForm(); 

참고 : 나는 포함 된 변수를 표시하기 위해 변수의 $ 접두어를 사용 jQuery 객체.

function clearError(form) { 
    $(form + ' .validation-summary-errors').each(function() { 
     $(this).html("<ul><li style='display:none'></li></ul>"); 
    }) 
    $(form + ' .validation-summary-errors').addClass('validation-summary-valid'); 
    $(form + ' .validation-summary-errors').removeClass('validation-summary-errors'); 
    $(form).removeData("validator"); 
    $(form).removeData("unobtrusiveValidation"); 
    $.validator.unobtrusive.parse($(form)); 
}; 

내가 AaronLS에 의해 코멘트에 주어진 대답을 시도했지만 해결책 그래서 그냥 같이 할 수 없어 :

+1

귀하의 요구 사항은 약간 다를 수 있습니다 만, 간단하게'$ ('# someFormId')로 수정했습니다. validate(). resetForm(); ' – AaronLS

+0

@AaronLS. jquery.validade.unobtrusive 또는 아닙니다, 나는 동일한 문제가 있었고 귀하의 코드가 그것을 해결했습니다. 깨끗하고 간단합니다, 고마워요. – BernardA

+0

나는 똑같은 문제가 있었고 당신의 솔루션은 훌륭하게 작동했습니다. –

0

내가이 같은 오류를 지우 잘못 생각 될 수 있습니다.

누군가에게 도움이 될 수 있습니다.

1

$ ("# 양식"). ('. 현장 검증-오차 범위')를 찾을 수 있습니다. HTML ('')

0

가 여기에 내가 모든 오류를 재설정/취소 사용하여 종료 코드입니다. 거기에 약간의 중복이있을 수 있지만 그것은 나를 위해 일하고 있습니다.

function removeValidationErrors(frmId) { 
 
    var myform = $('#' + frmId); 
 
    myform.get(0).reset(); 
 
    var myValidator = myform.validate(); 
 
    $(myform).removeData('validator'); 
 
    $(myform).removeData('unobtrusiveValidation'); 
 
    $.validator.unobtrusive.parse(myform); 
 
    myValidator.resetForm(); 
 
    $('#' + frmId + ' input, select').removeClass('input-validation-error'); 
 
}

관련 문제