如何在仅使用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; 
     } 
    }); 
}); 

此代码未经测试，请告诉我它是否无效。