Gửi hai biểu mẫu với một nút

Question

Tôi có hai biểu mẫu HTML, một biểu mẫu gửi dữ liệu khi nhập vào cơ sở dữ liệu bằng cách sử dụng PHP, hướng khác hướng người dùng đến trang thanh toán paypal, vấn đề của tôi là người dùng phải gửi cả hai biểu mẫu mà tất nhiên tôi không muốn họ phải làm. Có anyway để sử dụng một nút gửi cho hai hình thức?

(Javascript được hoan nghênh)

Answer 1

Bạn sẽ có thể làm điều này với JavaScript:

<input type="button" value="Click Me!" onclick="submitForms()" /> 

Nếu hình thức của bạn có ID:

submitForms = function(){ 
    document.getElementById("form1").submit(); 
    document.getElementById("form2").submit(); 
} 

Nếu hình thức của bạn không có ID nhưng có tên:

submitForms = function(){ 
    document.forms["form1"].submit(); 
    document.forms["form2"].submit(); 
} 

Answer 2

Nếu bạn có một nút gửi thường xuyên, bạn có thể thêm một sự kiện onclick với nó mà không được công sau:

document.getElementById('otherForm').submit(); 

Answer 3

Bạn có thể gửi biểu mẫu đầu tiên sử dụng AJAX, nếu không nộp ai sẽ ngăn chặn sự khác khỏi bị nộp .

Answer 4

Gửi biểu mẫu khiến trang điều hướng đến action của biểu mẫu. Vì vậy, bạn không thể gửi cả hai hình thức theo cách truyền thống. Nếu bạn cố gắng làm như vậy với JavaScript bằng cách gọi form.submit() trên mỗi biểu mẫu liên tiếp, mỗi yêu cầu sẽ bị hủy bỏ trừ lần gửi cuối cùng. Vì vậy, bạn cần gửi biểu mẫu đầu tiên không đồng bộ qua JavaScript:

var f = document.forms.updateDB; 
var postData = []; 
for (var i = 0; i < f.elements.length; i++) { 
    postData.push(f.elements[i].name + "=" + f.elements[i].value); 
} 
var xhr = new XMLHttpRequest(); 
xhr.open("POST", "mypage.php", true); 
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); 
xhr.send(postData.join("&")); 

document.forms.payPal.submit(); 

Answer 5

Trong Chrome và IE9 (chỉ tôi đoán tất cả các trình duyệt khác) sẽ kết nối ổ cắm đầu tiên . (Trình duyệt phát hiện điều này vì cả hai yêu cầu được gửi trong một "timeslice" JavaScript trong mã của bạn ở trên và loại bỏ tất cả trừ yêu cầu cuối cùng.)

Nếu bạn thay vào đó gọi lại một số sự kiện làm lần gửi thứ hai (nhưng trước khi trả lời) được nhận), socket của yêu cầu đầu tiên sẽ bị hủy. Đây là chắc chắn không có gì để đề xuất vì máy chủ trong trường hợp đó có thể đã xử lý yêu cầu đầu tiên của bạn, nhưng bạn sẽ không bao giờ biết chắc chắn.

Tôi khuyên bạn nên sử dụng/tạo một yêu cầu duy nhất mà bạn có thể giao dịch phía máy chủ.

Answer 6

nếu bạn muốn gửi hai hình thức với một nút bạn cần phải làm điều này:

1- sử dụng setTimeout()

2- phép chương trình cửa sổ pop up

<script> 
function myFunction() { 
setTimeout(function(){ document.getElementById("form1").submit();}, 3000); 
setTimeout(function(){ document.getElementById("form2").submit();}, 6000); 
} 
</script> 
<form target="_blank" id="form1"> 
<input type="text"> 
<input type="submit"> 
</form> 
<form target="_blank" id="form2"> 
<input type="text"> 
<input type="submit"> 
</form> 

javascript không gửi hai biểu mẫu cùng một lúc., chúng tôi gửi hai biểu mẫu với một nút không cùng một lúc nhưng sau khi bảo vệ.

chỉnh sửa: khi chúng tôi sử dụng mã này, trình duyệt không cho phép bật lên.
nếu bạn sử dụng mã này cho phần mềm của bạn như tôi chỉ cần đặt trình duyệt cho hiển thị bật lên nhưng nếu bạn sử dụng nó trong thiết kế trang web, trình duyệt là một rào cản và mã không chạy.

Answer 7

Câu trả lời hay nhất hiện được chọn là quá mờ để đáng tin cậy.

này cảm thấy đối với tôi giống như một cách khá an toàn để làm điều đó:

(javascript: sử dụng jQuery để viết nó đơn giản hơn)

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

function doubleSubmit(e1) { 
    e1.preventDefault(); 
    e1.stopPropagation(); 
    var post_form1 = $.post($(this).action, $(this).serialize()); 

    post_form1.done(function(result) { 
      // would be nice to show some feedback about the first result here 
      $('#form2').submit(); 
     }); 
}; 

bài viết dưới hình thức đầu tiên mà không thay đổi trang, chờ đợi quá trình hoàn thành. Sau đó, đăng biểu mẫu thứ hai. Bài đăng thứ hai sẽ thay đổi trang, nhưng bạn có thể muốn có một số mã tương tự cũng cho biểu mẫu thứ hai, nhận đối tượng trì hoãn thứ hai (post_form2?).

Tôi chưa thử nghiệm mã.