将 html 表输入值添加到 mysql 数据库表答案

【问题标题】：Add html table input values to a mysql database table将 html 表输入值添加到 mysql 数据库表
【发布时间】：2018-06-20 01:32:39
【问题描述】：

我已经广泛搜索了这个问题的答案，但找不到任何答案。

我想使用 php 和 javascript 将 html 表的内容添加到 mysql 数据库中，其中每一行都是一条新记录。

这是一个表格示例：

<table width="100%" border="1" cellspacing="0" cellpadding="0">
  <tr>
    <th scope="col">ID</th>
    <th scope="col">NAME</th>
    <th scope="col">EMAIL</th>

  </tr>
  <tr id="row">
    <td><input name="ID" type="text" value="20" /></td>
    <td><input name="NAME" type="text" value="Peter" /></td>
    <td><input name="EMAIL" type="text" value="peter@gmail.com" /></td>
  </tr>
  <tr id="row">
    <td><input name="ID" type="text" value="21" /></td>
    <td><input name="NAME" type="text" value="Jhon" /></td>
    <td><input name="EMAIL" type="text" value="jhon@yahoo.com" /></td>
  </tr>
  <tr id="row">
    <td><input name="ID" type="text" value="22" /></td>
    <td><input name="NAME" type="text" value="Mike" /></td>
    <td><input name="EMAIL" type="text" value="mike@hotmail.com" /></td>
  </tr>
</table>

<input name="Btn" type="button" onclick="addRecords()" value="Add"/>
</form>

还有我尝试过的 javascript 示例：

<script>
function addRecords()
{
    var row = document.getElementById("row")


    for (x in row)
    {
        $.post="<? $insertSQL = sprintf("INSERT INTO accounts (acc_id, acc_name, acc_email) VALUES (%s, %s)",
                       GetSQLValueString($_POST['ID'], "integer"),
                       GetSQLValueString($_POST['NAME'], "text"),
                       GetSQLValueString($_POST['EMAIL'], "text"));

  mysql_select_db($database_G3CSAdminControlPanel, $G3CSAdminControlPanel);
  $Result1 = mysql_query($insertSQL, $G3CSAdminControlPanel) or die(mysql_error()); ?>"
    }
}

</script>

上面做了什么，它只是将表中的最后一条记录添加到数据库中。我猜我的问题在于 php 代码，每个输入也应该放入一个数组中，而不仅仅是行，但不知道该怎么做。

更新我展示的代码只是我正在尝试做的一个例子。行的 ID 必须保持不变，因为我使用的是在我的实际网页中创建表格的脚本。

基本上我想做以下事情，但在 PHP 中：

<script>
function addRecords()
{
    var row = document.getElementById("row");
    var n = 0;
    var q = 0;
    for (x in "row")
    {
        n++;
        var code = document.getElementsByName("ID")[q].value;
        var desc = document.getElementsByName("NAME")[q].value;
        var price = document.getElementsByName("EMAIL")[q].value;
        alert(code + ' ' + desc + ' ' + price);
        q++;
    }
    alert('There is ' + n + ' rows in the table');
}
</script>

脚本返回每一行中输入的值。我想在 PHP 中做类似的事情，但是将每行中输入的值添加为数据库表中的记录。

因此，它应该执行一个 PHP 脚本来插入该行的记录，而不是为每一行执行 Javascript 警报。

【问题讨论】：

你研究过 AJAX 方法吗？还是 JQuery？
JS 运行在客户端，PHP 运行在服务器端。你正在尝试的将不起作用，期间。您需要使用 AJAX 或完整的往返传统表单提交系统。
我将检查 AJAX 和 JQuery。我现在意识到服务器端 PHP 不能与客户端 JS 混合。尝试弄清楚如何在 PHP 中执行此操作，但 PHP 交互和返回 html 值/元素的方式不像 JS 那样简单：/

标签： javascript php mysql html-table

【解决方案1】：

您必须唯一标识每一行（ID0、EMAIL0 等）。这在通过 PHP 或脚本构建表时很容易完成。然后在你的 PHP 表单代码中，你在 $_GET 上做一个 foreach 并阅读每个。你现在拥有它的方式，每个后续的 ID、EMAIL 等都覆盖了前一个。

【讨论】：

【解决方案2】：

您需要插入三个字段。每个都有一些。因此，您需要使用输入字段的名称作为 html 数组。否则在表单发布时，最后一个字段将覆盖之前的字段。

具体来说，编辑你的标记如下：

<table width="100%" border="1" cellspacing="0" cellpadding="0">
  <tr>
    <th scope="col">ID</th>
    <th scope="col">NAME</th>
    <th scope="col">EMAIL</th>
  </tr>
  <tr id="row1">
    <td><input name="ID[]" type="text" value="22" /></td>
    <td><input name="NAME[]" type="text" value="Mike" /></td>
    <td><input name="EMAIL[]" type="text" value="mike@hotmail.com" /></td>
  </tr>
  <tr id="row2">
    <td><input name="ID[]" type="text" value="22" /></td>
    <td><input name="NAME[]" type="text" value="Mike" /></td>
    <td><input name="EMAIL[]" type="text" value="mike@hotmail.com" /></td>
  </tr>
  <tr id="row3">
    <td><input name="ID[]" type="text" value="22" /></td>
    <td><input name="NAME[]" type="text" value="Mike" /></td>
    <td><input name="EMAIL[]" type="text" value="mike@hotmail.com" /></td>
  </tr>
</table>

【讨论】：

谢谢，我花了一些时间来弄清楚如何使用这些数组的代码，但让它工作了。而不是为每一行分配一个唯一的名称。我创建了一个隐藏字段，该字段的值由 javascript 为每一行递增。然后使用该值循环遍历所有数组值。

【解决方案3】：

与其直接访问您的行，不如先获取您的表，然后再获取行。

var table = document.getElementById('myTable');
for (i=1; i < table.rows.length; i++) {
    var row = table.rows(i);
}

【讨论】：

【解决方案4】：

如果你有多个相同id的元素，比如：

 <tr id="row">

然后是函数：

document.getElementById("row")

将只考虑其中的最后一个（这取决于浏览器）。

要真正确定您将真正获得您必须为它们提供不同 ID 的所有元素。喜欢

<tr id="row1">...
...
<tr id="row2">...
...
<tr id="row3">...
...

祝你好运！

【讨论】：