提交表单后保持同一页面，然后再次处理表单

Question

我正在将Marketo（第三方营销软件）与我们网站上的一个工具集成在一起。

提交后，有一个表单可以调用“ http://info.a10networks.com/index.php/leadCapture/save ” 操作 ，并将表单数据保存到Marketo中：

<form
    class="lpeRegForm formNotEmpty"
    method="post"
    enctype="application/x-www-form-urlencoded"
    action="http://info.a10networks.com/index.php/leadCapture/save"
    id="mktForm_1225"
    name="mktForm_1225">

我想使用相同的表单数据将其存储在本地数据库（MySQL）中。 理想情况下，我希望在发送表单数据后加载相同的页面，并在本地存储此表单数据。

有没有办法执行以下操作：

1. 调用表单操作，并将数据发送到外部数据库
2. 加载同一页面并将此表单数据本地存储到数据库中（能够使用$_POST ）

我正在使用PHP和普通的javascript进行这种集成。 请指教。

Answer 1

您可以使用ajax调用自己的脚本，然后将表单提交给marketo。

基本上，如果您希望在将数据发送到远程服务器进行处理之前捕获数据，则首先捕获数据，然后允许表单提交并在之后执行其预期的处理。

在这里我们捕获表单的单击，然后确保通过向其添加类来禁用该按钮。 因此，在处理完成之前，它不会让用户多次点击。 当它完成收集信息并发送到你的php页面时，它将表单提交给它的action属性。

在这个例子中，我从name属性设置为firstName的输入中获取值，该值将被发送到我的PHP脚本，因为我选择了一种POST我可以在我的POST看到它

$_POST['firstName']

调试你的帖子参数以查看数据的样子，以便在接收PHP脚本中进行调整

echo '<pre>', print_r($_POST, true), '</pre>';

这将显示捕获的数据。

<script type="text/javascript">

$(document).ready(function() {


  $('.formSubmitButton').on('click', function(e) {

    e.preventDefault();
    if (!$('.formSubmitButton').hasClass('submitted'))
      {
        // disable the form to prevent multple clicks
        $('.formSubmitButton').addClass('submitted');

        $.ajax('/path/to/my/db/script', {

          type: 'post',
          data:{
             firstName: $('[name="firstName"]).val(),
             lastName: $('[name="lastName"]).val()
          }     
        }).done(function(data) {

            $('.parentForm').submit();

            // enable the form
            $('.formSubmitButton').removeClass('submitted');
        });
      }
      return false;
  });
});

</script>