javascript - wordpress 将数据添加到表中并生成新行

Question

在 WordPress 中我有一个这样的表单

<form id="data-form" action="">
    <table id="user-data">
        <tr>
            <td>Name</td>
            <td>Email</td>
        </tr>
        <tr>
            <td><input type="text" name="name"></td>
            <td><input type="text" name="email"></td>
        </tr>
    </table>
    <button type="submit" value="submit" name="submit">Submit</button>
</form>

因此，当我单击“提交”按钮时，它会将数据插入到表中，如下所示

global $wpdb;
if ( isset($_POST['submit']) ) {
  $wpdb->insert(
    'fl_user_data', 
    array(
      'id' => '',
      'name' => $_POST['name'],
      'email' => $_POST['email'])
  );
  echo 'success';
}

它正在将值插入数据库。现在我在表单中使用了一个名为“添加行”的按钮。因此该按钮将该行添加到表中。现在，当我单击按钮时，它会像这样向表格添加一行

<a href="#" id="add-row">+Add Row</a>
<script>
  $('body').on('click', '#add-row', function(e) {
    var Html = $('<tr><td><input type="text" name="name"></td><td><input type="text" name="email"></td></tr>');
    $('table#user-data').append(Html);
  });
</script>

当我单击“添加行”按钮时，这将添加一行。因此，当所有字段都填满新行并单击“提交”按钮时 那么它只插入一行值。那么有人可以告诉我如何在数据库表中插入数据行 成行。任何帮助和建议都将非常感激。谢谢

Answer 1

因为您添加的字段都具有相同的名称(姓名、电子邮件)，所以每个字段都会覆盖下一个字段。

您需要做的是，每次添加字段时，都以已知的方式使名称唯一。例如 name1, email1;姓名2、电子邮件2；姓名 3、电子邮件 3 等。然后在插入脚本中，您需要循环遍历并一次添加一个。

更好的方法可能是有一个名为“row_count”的隐藏字段，每次添加行时都会递增该字段，这样在 PHP 端，您只需使用提供的数字进行循环，而无需弄清楚如何进行循环你有很多行。

不要忘记清理所有输入等。