Làm cách nào để sử dụng plugin Xác thực jQuery với xác thực phía máy chủ ở cấp biểu mẫu?

Question

Cách tốt nhất để kích hoạt lỗi trên các thành phần cho lỗi xác thực phía máy chủ là gì sau khi biểu mẫu vượt qua xác thực phía máy khách ban đầu?

$("#contact_form").validate({ 
    submitHandler: function(form) { 
    $.ajax({ 
     type: 'POST', 
     dataType: 'json', 
     url: '/contact/send', 
     data: $(form).serialize(), 
     success: function(response) { 
     if(response.error) { //server came back with validation issues 
      var fields = response.fields; 
      for(var i=0, var len = fields.length; i < len; i++) { 
      var field_name = fields[i].name; 
      var field_error = fields[i].error; 

      // TRIGGER ERROR ON AFFECTED ELEMENT 

      } 
      return false; 
     } 
     //everything went ok, so let's show a thanks message 
     showThanks(); 
     } 
    } 
}); 

Tôi đang nghĩ đến một cái gì đó như:

$(form).find("[name='" + field_name + "']").triggerError(field_error); 

Nhưng tôi không thấy bất kỳ phương pháp api cho tay kích hoạt lỗi theo cách đó.

Answer 1

Tôi nghĩ rằng tôi figured nó ra từ tài liệu của Validator/showErrors

var validator = $("#contact_form").validate(); 
validator.showErrors({"state": "Bad state."}); 

Answer 2

Làm cho nó. Write a plugin sẽ làm bất cứ điều gì bạn muốn. Hoặc nếu bạn gặp rắc rối, chỉ cần viết một hàm javascript để thực hiện và gọi nó.

Tôi sẽ viết một plugin có thể tạo một div, điền vào đó bằng văn bản lỗi và tạo hiệu ứng độc đáo.

Answer 3

Khi gửi biểu mẫu, tôi sẽ làm cho mục tiêu của biểu mẫu là một khung nội tuyến vô hình trên trang mà sau đó sẽ gọi một hàm trong topWindow với kết quả là.

<iframe id="subject_frame" name="submit_frame" src="#" style="width:0;height:0;border:0px solid #fff;"></iframe> 

sau đó trong trang trong iframe gọi phương thức javascript trong cửa sổ trên cùng chuyển hướng thành công hoặc hiển thị lỗi.

Trong iframe

<script language="javascript" type="text/javascript"> 
    window.top.window.submitComplete("<?php echo $response; ?>"); 
</script> 

Trong cửa sổ đầu (như là một ví dụ)

function uploadComplete(result){ 
    $.unblockUI(); 
    if(result == "OK"){ 
     $.blockUI({ message: "<span style='color:green;'>File upload successful, request submitted.</span><br/><br/>Redirecting..." }); 
     setTimeout(function() { 
      $.unblockUI({ 
       onUnblock: function(){ window.location='thankyou.php'; } 
      }); 
     }, 2000); 

    } else { 
     $.blockUI({ message: "<span style='color:red;'>Failed.</span><br/><br/>"+result }); 
     $('.blockOverlay').attr('title','Click to remove').click($.unblockUI); 
    } 
}