如何一次提交两张表格


How to get two forms on one submit

我有两种形式如下:

<h2>First form</h2>
<form id="first-form">
  <table>
    <tr>
      <td>
        <input type="text" name="left[]" value="">
      </td>
      <td>
        <input type="text" name="right[]" value="">
      </td>
    </tr>
    <tr>
      <td>
        <input type="text" name="left[]" value="">
      </td>
      <td>
        <input type="text" name="right[]" value="">
      </td>
    </tr>
    <tr>
      <td>
        <input type="text" name="left[]" value="">
      </td>
      <td>
        <input type="text" name="right[]" value="">
      </td>
    </tr>
    <tr>
      <td>
        <input type="text" name="left[]" value="">
      </td>
      <td>
        <input type="text" name="right[]" value="">
      </td>
    </tr>
  </table>
</form>
<!-- some more HTML -->
<h2>Second form</h2>
<form id="second-form">
  <label>
    <input type="search" name="sentence" value="i like the bananas">
  </label>
  <label>
    <input type="text" name="parse-as" value="S">
  </label>
  <label>
    <select name="include-features">
      <option>Yes</option>
      <option selected="selected">No</option>
    </select>
  </label>
  <label>
    <select name="show-earley">
      <option>Yes</option>
      <option selected="selected">No</option>
    </select>
  </label>
  <button type="submit">Parse</button>
</form>

请注意,第一个表单可以包含更多的行;用户可以向表单中添加更多行。正如您所看到的,只有一个提交按钮。这是因为两份表格必须同时提交。在jQuery中,我会做这样的事情:

$("#second-form").submit(function(event) {
  $("first-form").submit();
  event.preventDefault();
});

作为团队的前端开发人员,我需要将两个表单的值传递给后端。不幸的是,我不知道该怎么做。我想我可以做这样的事情:

$("#second-form").on("submit", function(event) {
  $("#first-form").submit();
  $.post("php/do.php", $("#second-form").serialize());
  event.preventDefault();
});
$("#first-form").on("submit", function(event) {
  $.post("php/do.php", $("#first-form").serializeArray());
  event.preventDefault();
});

.serializeArray()似乎是必要的,因为#first-form的HTML中有类似数组的值。然而,在第二种形式中,我们不需要数组。我现在遇到的问题是,do.php中需要什么代码来处理输入。如何访问数据,即PHP中的序列化表单?

我尝试了很多东西,比如

<?php
$data = parse_str($_POST["right[]"]);
var_dump($data);
$date1 = parse_str($_POST["right[][0]"]);
var_dump($data);
$data2 = parse_str($_POST["right[][1]"]);
var_dump($data);
?>

但所有这些都返回一个Undefined index错误,这似乎意味着我的"选择器"是错误的。在PHP中,我将如何从第一个表单中选择数组,并选择第二个表单的值?我提交first-form和第二个的jQuery方法正确吗?

为什么不这样做:

<h2>First form</h2>
<form id="first-form">
  <table>
    <tr>
      <td>
        <input type="text" name="left[]" value="">
      </td>
      <td>
        <input type="text" name="right[]" value="">
      </td>
    </tr>
    <tr>
      <td>
        <input type="text" name="left[]" value="">
      </td>
      <td>
        <input type="text" name="right[]" value="">
      </td>
    </tr>
    <tr>
      <td>
        <input type="text" name="left[]" value="">
      </td>
      <td>
        <input type="text" name="right[]" value="">
      </td>
    </tr>
    <tr>
      <td>
        <input type="text" name="left[]" value="">
      </td>
      <td>
        <input type="text" name="right[]" value="">
      </td>
    </tr>
  </table>
  <!-- some more HTML -->
  <h2>Second form</h2>
  <label>
    <input type="search" name="sentence" value="i like the bananas">
  </label>
  <label>
    <input type="text" name="parse-as" value="S">
  </label>
  <label>
    <select name="include-features">
      <option>Yes</option>
      <option selected="selected">No</option>
    </select>
  </label>
  <label>
    <select name="show-earley">
      <option>Yes</option>
      <option selected="selected">No</option>
    </select>
  </label>
  <button type="submit">Parse</button>
</form>

也许这不是最干净的方法,但它更容易。只需使用即可获得结果

<?php
$data = parse_str($_POST["right[]"]);
var_dump($data);
$date1 = parse_str($_POST["right[][0]"]);
var_dump($data1);
$data2 = parse_str($_POST["right[][1]"]);
var_dump($data2);
?>