Question

通过使用javascript，我已动态地向表中添加了新行。但我不知道如何从PHP中那些动态创建的行访问数据，以便我可以将它们插入到数据库中。

我在这里给出html和java脚本请帮我写PHP代码从动态创建的表中提取数据。我可以使用DOM对象从静态表中提取数据。

<form name="frmtransport" method="post" action="transportation.php"  id="Form1">
  <table  id="Table1" name="transport">
    <tr >
      <td colspan="8" >
        Transportation 
      </td>
  </tr>
  <tr style="height: 36px;">
    <td colspan="2" Date 
  </td>
    <td    colspan="6" >
      <input type="text" id="jQueryDatePicker1"  name="trdate" value="25/02/2015">
    </td>
  </tr>
  <tr>
    <td>
      location 
    </td>
    <td>
      no.of boxes
    </td>
    <td>
      Gf.no 
    </td>
    <td>
      invoice no
    </td>
    <td>
      invoice date
    </td>
    <td>
      lorryno
    </td>
    <td>
      vat no 
    </td>
  </tr>
  <tr>
    <td >
      <select name="cmblocation" size="1" id="Combobox1"             style="position:relative;width:170px;height:36px;z-index:1;">
        <option value="volvo">
          Volvo
        </option>
        <option value="saab">
          Saab
        </option>
        <option value="mercedes">
          Mercedes
        </option>
        <option value="audi">
          Audi
        </option>
      </select>
    </td>
    <td >

      <input type="text" id="Editbox1" name="txtnoofboxes">

    </td>
    <td >

      <input type="text" id="Editbox2" name="txtgrno" >

    </td>
    <td >

      <input type="text" id="Editbox3" name="txtinvoiceno" >

    </td>
    <td >

      <input type="text" id="Editbox4" name="txtinvoiceno" >

    </td>
    <td >

      <input type="text" id="Editbox5" name="txtinvoiceno" >

    </td>
    <td >

      <input type="text" id="Editbox6" name="txtinvoiceno" >

    </td>
    <td >

      <input type="button" id="Button1" onclick="myFunction();" name="cmdadd" value="Add" >

    </td>
  </tr>

  <tr>
    <td colspan="8">

      <input type="submit" value="Save" name="btnsave" id="Button1" 
    </td>
    </tr>
  </table>

</form>

JavaScript代码：

function myFunction() {
    var table = document.getElementById("Table1");
    //var rowc=table.rows.length;
    var row = table.insertRow(4);
    row.className = "rowstyle";

    var cell0 = row.insertCell(0);
    var element = document.getElementById("Combobox1");
    var op = element.options[element.selectedIndex].text;
    document.getElementById("Combobox1").value = "";

    cell0.innerHTML = op;
    var cell1 = row.insertCell(1);
    cell1.innerHTML = document.getElementById("Editbox1").value;
    document.getElementById("Editbox1").value = "";

    var cell2 = row.insertCell(2);
    cell2.innerHTML = document.getElementById("Editbox2").value;
    document.getElementById("Editbox2").value = "";
    var cell3 = row.insertCell(3);
    cell3.innerHTML = document.getElementById("Editbox3").value;
    document.getElementById("Editbox3").value = "";
    var cell4 = row.insertCell(4);
    cell4.innerHTML = document.getElementById("jQueryDatePicker2").value;
    document.getElementById("jQueryDatePicker2").value = "";
    var cell5 = row.insertCell(5);
    cell5.innerHTML = document.getElementById("Editbox5").value;
    document.getElementById("Editbox5").value = "";
    var cell6 = row.insertCell(6);
    cell6.innerHTML = document.getElementById("Editbox6").value;
    document.getElementById("Editbox6").value = "";
    var cell7 = row.insertCell(7);
    cell7.innerHTML = '<input type="button" id="Button1" style="width:45px;height:35px;" value="Delete" onclick="deleteRow(this)"/>';

    /* cell1.innerHTML = document.getElementsByName("txtnoofboxes").value;
      cell2.innerHTML = document.getElementsByName("txtnoofboxes");*/


}

Answer 1

提交表单时，表单中只有来自输入字段的数据将提交给服务器。您的代码从输入字段中取出输入的值并将它们放在表格单元格中，从而有效地将它们从提交的数据中删除。

您需要将创建的行的值添加到输入字段（或使用AJAX作为Deepak Kamat建议）。将值添加到输入字段时，由您决定。你可以这样做：

当用户点击添加时（这有可编辑字段的好处）。
当用户点击“保存”时。

第二个选项需要通过JavaScript form.submit()提交表单，但是如果您担心这一点，它可以让您不受大量输入字段的影响。

（另外，请注意捕获空值，以免意外创建空行）

从php中动态创建的html表访问数据

1 个答案: