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

Staying on same page after the form is submitted and then process the form again

本文关键字：表单 然后 处理 一页 提交      更新时间：2023-09-26

我正在将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进行集成。请告知。

您可以使用对自己脚本的ajax调用来完成此操作，然后将表单提交给marketo。

从本质上讲，如果你想在数据发送到远程服务器进行处理之前捕获数据，你会先捕获数据，然后允许表单提交，然后进行预期的处理。

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

在这个例子中，我从name属性设置为firstName的输入中获取值，这个值将被发送到我的PHP脚本，因为我选择了一种类型的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>
相关文章：