單擊按鈕后發送兩個表單并在后臺運行php

我創建了這個網站并與 payfast 集成，它運行良好。但現在我想在下訂單按鈕上執行另一個 php 腳本，它將詳細資訊輸入資料庫 這里是我的代碼很長....我對 Ajax 或 javascript 一無所知！請幫忙

<form id="form1" action="payment.php" method="POST">
           some stuff...    
            </form>

<?php
$htmlForm = '<form action="https://'.$pfHost.'/eng/process" method="post" id="form2">';
  
$htmlForm .= '<input type="submit" id="submit" name="submit" class="btn btn-primary btn-lg btn-flat" value="PLace Order" onclick="submitForms()"></form>';
?>

            <?php
           echo" 
            ".$htmlForm."
          </div>";
                }
                else{
                  echo '...';      
                }
              ?> 
          
<script>
submitForms = function() {
   document.getElementById("form1").submit();
   document.getElementById("form2").submit();
}
</script>

 $(function() {
  $(".submit").click(function() {
      var uid = $("#uid").val();
        var prodtls = $("#prodtls").val();
        var fname = $("#fname").val();
        var amnt = $("#amnt").val();
        var mail = $("#mail").val();

  var dataString = 'uid='  uid   '&prodtls='   prodtls   '&fname'  fname   '&amnt'   amnt   '&mail'   mail;

if(time=='' || date=='')
{
  $('.success').fadeOut(200).hide();
  $('.error').fadeOut(200).show();
}
else
{
  $.ajax({
    type: "POST",
    url: "payment.php",
    data: dataString,
    success: function(){
     $('.success').fadeIn(200).show();
     $('.error').fadeOut(200).hide();
    }
  });
}
return false;
});
});

我嘗試了我找到的ajax，但它從來沒有奏效。檢查我的代碼的末尾！我需要的是payment.php將在后臺執行，同時它會引導用戶進行payfast

我只想通過 AJAX 提交第一個。

uj5u.com熱心網友回復：

您的嘗試沒有多大意義，因為它似乎沒有針對第一個表單（您說您想要的）并且可能不會阻止默認的回發行為。

據我了解，您希望用戶單擊提交的任何表單，代碼實際上將通過 AJAX 提交第一個表單，然后通過標準回發提交第二個表單。

這應該做的作業：

HTML：

<form id="form1" class="doubleForm" action="payment.php" method="post">
    <input type="submit" id="submit1" name="submit" class="btn btn-primary btn-lg btn-flat" value="Submit">
</form>

<form id="form2" class="doubleForm" action="https://example.com/eng/process" method="post">';
  <input type="submit" id="submit2" name="submit" class="btn btn-primary btn-lg btn-flat" value="Place Order">
</form>
          

JavaScript：

//handle submission of both forms
$(".doubleForm").submit(function(event) {
  event.preventDefault(); //stop standard postback

  var uid = $("#uid").val();
  var prodtls = $("#prodtls").val();
  var fname = $("#fname").val();
  var amnt = $("#amnt").val();
  var mail = $("#mail").val();
  var dataString = 'uid='  uid   '&prodtls='   prodtls   '&fname'  fname   '&amnt'   amnt   '&mail'   mail;

  if(time == '' || date == '')
  {
    $('.success').fadeOut(200).hide();
    $('.error').fadeOut(200).show();
  }
  else
  {
    //submit first form via AJAX
    var request = $.ajax({
      type: "POST",
      url: "payment.php",
      data: dataString
    });

    request.done(function(response) {
      $('.success').fadeIn(200).show();
      $('.error').fadeOut(200).hide();
    
      //now the first form is submitted and server has responded, we can trigger "normal" (non-AJAX) submission of second form
      document.querySelector("#form2").submit();
    });
  }
});

uj5u.com熱心網友回復：

所以這實際上使用.serialize(). 感謝@ADyson 的提示，我只需要稍微調整一下，雖然我沒有js經驗

<script type="text/javascript">
    $(function(){
        $("#submit2").click(function(){
            var dataString = $("#form1").serialize();
            $.ajax({
                type: "POST",
                url: "payment.php",
                data: dataString,
                success: function(data)
                {
                    alert('Success!');
                    $("#form1")[0].reset();
                }
            });
        });
    });
</script>

標籤：

上一篇：提交表單時未取消選中來自復選框

下一篇：Laravel7-表單