Xác thực sẽ không gửi biểu mẫu bằng séc ajax

Question

Tôi đang sử dụng jQuery Validate plugin để xác thực trường email trong biểu mẫu của tôi bằng cách thực hiện yêu cầu ajax để đảm bảo rằng email chưa được người dùng khác thực hiện. Tôi làm như vậy bằng cách thêm một quy tắc như thế này:

//make sure email field is on form before adding rule 
if ($(".unique_email").is("*")) { 
    //remote validation 
    $(".unique_email").rules("add", { 
     remote: "http://test.nethop.com/test.cgi", 
     messages: { 
      remote: "This email is already in use" 
     } 
    }); 
} 

Tuy nhiên, bất cứ khi nào tôi nhấn 'submit' trên biểu mẫu, đầu tiên nó sẽ làm một yêu cầu ajax để đảm bảo email không được thực hiện, và sau đó nó sẽ không gửi ngay cả khi email xác nhận là không sao. Bạn phải nhấn gửi một lần nữa và sau đó nó sẽ gửi. Có ai biết tại sao điều này?

Tôi đã thiết lập một số jsfiddle trình bày sự cố. Nếu bạn sử dụng công cụ nhà phát triển chrome hoặc firebug, bạn có thể xem yêu cầu ajax đang được thực hiện, trả lại true và vẫn không gửi.

HTML

<form id="listing" method="post"> 
    <ul> 
     <li> 
      <label for="username">Email *</label> 
      <input type="text" name="username" id="username" autocomplete="off" 
      class="email required unique_email" value="test@test.com" /> 
     </li> 
     <li> 
      <input type="submit" name="submit" id="submit" class="btn" value="Save" 
      /> 
     </li> 
    </ul> 
</form> 

Kịch bản đầy đủ:

$(document).ready(function() { 
    var validator = $("form").validate({ 
     onkeyup: false, 
     onblur: true, 
    }); 

    if ($(".unique_email").is("*")) { 
     //remote validation 
     $(".unique_email").rules("add", { 
      remote: "http://test.nethop.com/test.cgi", 
      messages: { 
       remote: "This email is already in use" 
      } 
     }); 
    } 
}); 

Answer 1

Được rồi, cái này là loại kỳ lạ để chịu với tôi.

Thực tế là bạn có input với tên/id submit đang gây ra sự cố. Tôi nghĩ rằng điều này là do dưới mui xe, jQuery xác thực đang gọi form.submit. Trong trường hợp của bạn, form.submit là một phần tử biểu mẫu và do đó, điều này không có gì.

Nếu bạn đổi tên nút submit, mọi thứ đều hoạt động tốt.

Ví dụ:http://jsfiddle.net/42TK4/7/