jquery: gửi biểu mẫu hai lần

Question

Tôi đang tạo biểu mẫu đăng ký cho khách hàng cho một sự kiện mà họ đang lưu trữ. Các chi tiết cơ bản của người dùng được gửi tới hệ thống của bên thứ ba (ví dụ: tên, email, v.v.) nhưng phần còn lại của các trường cần được gửi qua email cho khách hàng.

tôi cần một cái gì đó như thế này xảy ra:

1. List item
2. dùng điền vào mẫu đơn
3. jquery bvalidator kiểm tra dưới hình thức cho các trường bắt buộc
4. mẫu được gửi (thông qua ajax) cho một trang riêng nơi email được gửi đến khách hàng
5. biểu mẫu sau đó được gửi (phương thức POST thông thường) cho hệ thống của bên thứ ba
6. trên người dùng thành công được chuyển trở lại url 'cảm ơn'.

Đây là mã tôi đã thử bằng cách sử dụng, nhưng nó được lặp lại liên tục tự gửi tới trang 'email' và không bao giờ gửi tới url bên ngoài.

Nếu tôi thay thế $('#form1').submit(); bằng cảnh báo, nó chỉ gửi một lần đến trang email và sau đó hiển thị cảnh báo chính xác.

var myvalidator = $('#form1').bValidator(optionsGrey); 

$('#form1').submit(function() { 
    if (myvalidator.isValid()) { 

    $.ajax({ 
     data: $('#form1').serialize(), 
     type: "POST", 
     url: "email_send.asp", 
     success: function() { 
     $('#form1').submit(); 
     } 
    }); 
    } 
    return false; 
}); 

Bất kỳ đề xuất nào về cách khắc phục sự cố này?

Answer 1

Hãy thử:

$('#form1').unbind('submit').submit(); 

Answer 2

thử unbinding nộp sự kiện trên thành công của bạn: Phương pháp của cuộc gọi ajax của bạn bằng cách gọi unbind

$('#form1').unbind('submit'); 
$('#form1')[0].submit(); // call native submit 

http://api.jquery.com/unbind/

Answer 3

Bạn có thể sử dụng jquery.form plugin cho gửi mẫu qua ajax. Thanh toán url sau: http://jquery.malsup.com/form/

Sau đó, trong kịch bản js bạn thử một cái gì đó như thế này

var myvalidator = $('#form1').bValidator(optionsGrey); 

$('#form1').submit(function(){ 
    if(myvalidator.isValid()){ 
     $(this).unbind('submit').submit(); 

}); 

Answer 4

Bạn có thể sử dụng unbind() để trở lại hành vi mặc định.

var myvalidator = $('#form1').bValidator(optionsGrey); 

$('#form1').submit(function() { 

    if(myvalidator.isValid()) { 

     $.ajax({ 
      data: $('#form1').serialize(), 
      type: "POST", 
      url: "email_send.asp", 
      success: function(){ 
       $('#form1').unbind('submit'); 
       $('#form1').submit(); 
      } 
     }); 

    } 

    return false; 

}); 

Answer 5

Hm Tôi không chắc là tôi hiểu. Bạn luôn luôn gửi email_send.asp như vậy và trên mọi thành công nó làm như vậy, do đó nó có vẻ khá rõ ràng lý do tại sao bạn gặp khó khăn trong một vòng lặp.

Nếu tôi hiểu bạn đúng, lần gửi thứ hai phải đến một url khác với trình xử lý thành công khác, đúng không?

Vì vậy, thay vì nộp mẫu một lần nữa bạn chỉ có thể viết một hàm ajax cơ bản:

$('#form1').submit(function() { 
    if (myvalidator.isValid()) { 
    $.ajax({ 
     data: $('#form1').serialize(), 
     type: "POST", 
     url: "email_send.asp", 
     success: function(){ 
     $.ajax({ 
      data: $('#form1').serialize(), 
      type: 'POST', 
      url: 'third_party.asp', 
      success: function() { 
      //display thank you message 
      }    
     }); 
     } 
    }); 
    }  
}); 

EDIT Dưới đây là một câu trả lời được cập nhật theo nhận xét của bạn:

var myvalidator = $('#form1').bValidator(optionsGrey); 

$('#form1').submit(function(){  
    if(myvalidator.isValid()){ 
    $.ajax({ 
     data: $('#form1').serialize(), 
     type: "POST", 
     url: "email_send.asp", 
     success: function(){ 
     $('#form1').unbind('submit').submit(); 
     } 
    }); 
    } 
    return false; 
}); 

Answer 6

Bạn có lý do để sử dụng phương thức submit? Lý do nó nhập vào một vòng lặp vô hạn là bởi vì nó gọi cùng trình lắng nghe sự kiện tương tự một lần nữa.

Nếu không, bạn chỉ có thể xếp hai lần gửi ajax, một đến trang e-mail và một lần nữa cho ứng dụng khách.

Cuối cùng, bạn có thể hủy liên kết trình xử lý sự kiện. Một cách ít được biết đến để hủy liên kết trình xử lý sự kiện là chuyển đối tượng sự kiện đến số unbind. Thao tác này sẽ chỉ hủy liên hệ với trình xử lý sự kiện hiện tại:

$('#form1').submit(function(e){ 
    if(myvalidator.isValid()){ 
$form = $('#form1'); 
$.ajax({ 
    data: $form.serialize(), 
       type: "POST", 
       url: "email_send.asp", 
       success: function(){ 
       $form.unbind(e).submit(); 
       } 
      }); 
    } 
    return false; 
}); 

Answer 7

Dưới đây là mã ví dụ về gửi biểu mẫu hai lần đến các URL khác nhau mà không cần chuyển hướng. Nhấp vào nút "Kiểm tra" hai lần.

<!DOCTYPE html> 
    <html> 
    <head> 
    <meta charset="ISO-8859-1"> 
    <title>Insert title here</title> 
    <script type="text/javascript" src="jQuery.js"></script> 
    <script type="text/javascript"> 
    $(document).ready(function() { 
     $("#testBtn").click(function() { 
      $("#form").submit(); 
      $("#form").submit(function() { 
       $("#form").attr("action", "download"); 
      }); 
     }); 
    }); 
    </script> 
    </head> 
    <body> 
     <form id="form" enctype="multipart/form-data" method="post" 
      action="upload" target="myIFrame"> 
      <input type="hidden" name="FileName" /> 
      <input type="file" name="FileDialog" size="100" /> 
      <input type="submit" /> <input name="txt" type="text" /> 
     </form> 
     <input id="testBtn" type="button" value="Test" /> 

     <iframe style="display: none;" src="javascript:''" id="myIFrame"> 
      <html> 
       <head></head> 
       <body></body> 
      </html> 
     </iframe> 
    </body> 
    </html> 

Answer 8

Tôi đang gặp phải sự cố tương tự. Sau đó, tôi nhận thấy rằng tôi đã vô tình liên kết tệp javascript tùy chỉnh của tôi hai lần để biểu mẫu đã được gửi hai lần bởi hai tập lệnh. Sự cố đã được giải quyết bằng cách xóa một chân trang biểu mẫu liên kết tập lệnh của trang.

<script src="<?php echo base_path; ?>/js/custom.js"></script> 
<script src="<?php echo base_path; ?>/js/custom.js"></script>