如何在僅使用1個提交按鈕成功發佈其他表單後才能提交表單？

Question

我在我的網頁上有兩種形式。我想給出他們正在同時提交的錯覺。我需要一個表單來處理，如果失敗，請不要處理第二個表單。第一種形式是付款信息。第二種形式是「提問問題」形式。我該怎麼做呢？我使用PHP作爲服務器端代碼。 Her is a screenshot of my 2 forms任何人想知道。注意：我刪除了用於提交Braintree表單的「付款」按鈕，因爲我想只有一個提交按鈕 - 插件的「發佈問題」按鈕。

1. 我如何開始使用只有1個按鍵兩種形式整體提交過程？
2. 如何限制第二張表格只有在第一次成功後纔會發佈？

Answer 1

This JSFiddle應該工作。

它只是在第一個表單中有一個簡單的條件因素（您可以修改它來檢查正確的付款信息），第二個表單具有提交按鈕。如果第一個表單的信息不正確，它將不會通過使用 return false;發送。如果確實通過了，那麼它會首先發送第一個表單，並使用 form.submit();，然後用第二個表單進行處理。

編輯：以上答案只是將兩種形式 - 它不檢查的第一個經過，但它確實insteads一些基本的JS驗證。

所以假設你有兩種形式（因爲你imgur鏈接被打破，我不能告訴他們真正的樣子）：

<form action="braintree.php"> 
    <!-- Payment options --> 
</form> 
<form action="questions.php"> 
    <!-- The questions you want --> 
    <button>Submit</button> 
</form> 

，並假定你有braintree.php文件：（你使用PHP，右）

<?php 
    // send data to braintree 
    if(/* payment goes through */) { 
     echo "0"; // echo error code 0 (no error) for JS 
    } else { 
     echo "1"; // echo error code 1 (error) for JS 
         // if you can get an error back from braintree, 
         // then you can add it here -- it will be sent 
         // back to JS and you can show it to the user 
    } 
?> 

，並假定你有JQuery的（JS），像這樣：

$("button").click(function() { 
    // manually send first form with AJAX 
    $.ajax({ 
     url: "braintree.php", 
     method: "post", 
     asynch: false, // so that the second form waits for this request to finish 
     data: { 
      // put in all the data to send in the braintree file here 
      fname: $("#fname").val(); 
      lname: $("#lname").val(); 
     } 
    }).done(function(data) { 
     // data will be the response from "braintree.php" 
     if(data == "0") { 
      return true; 
     } else { 
      // if you have a more specific error, you can alert() it here 
      return false; 
     } 
    }); 
}); 

此代碼未經測試，請告訴我它是否無效。