如何将名称属性添加到动态生成的

时间:2015-12-07 15:58:57

标签: javascript html5 forms dynamic html-table

我一直在寻找各种来源,试图找到一种方法将procedure TForm1.ClientDataSet2AfterPost(DataSet: TDataSet); begin if ClientDataSet2Sum.Value <> null then ClientDataSet1Sum.Value := ClientDataSet2Sum.Value; end; 添加到生成的表行中。以下是提交表单的表格部分。

name=""

以下是添加和删除行的脚本。

<table id="quote_form_table"border="1" style="border-collapse:collapse;border:1px solid #000000;width:100%" cellpadding="3" cellspacing="3">
    <tr>
        <td>Quantity</td>
        <td>Item</td>
        <td>Unit Price</td>

        </tr>
        <tr name="row[]">
         <td><input type="text" name="quantity" ></td>
         <td>
           <select name="products">
              <option>Roller banner</option>
              <option>Grasshopper</option>
              <option>Pop up display</option>
            </select>
         </td>
        <td>
          <select name="type">
            <option>Roller banner</option>
            <option>Grasshopper</option>
            <option>Pop up display</option>
          </select>
      </td>
    </tr>
</table>
<br>
  <button type="button"onclick="addrow()">Add Row</button>
  <button type="button"onclick="removerow()">Remove Row</button><br><br><br>

作为Javascript的新手,(我非常松散地使用“新手”这个术语,因为它不是我熟悉的语言来解决这个问题),我尝试使用setAttribute无济于事。

   <script>
    function addrow() {
        var table = document.getElementById("quote_form_table");
        var row = table.insertRow(-1);
        var cell1 = row.insertCell(0);
        var cell2 = row.insertCell(1);
        var cell3 = row.insertCell(2);

        cell1.innerHTML = '<input type="text" name="quantity" >';
        cell2.innerHTML = '<select name="products"><option>Roller banner</option><option>GrassHopper</option><option>Pop up display</option></select>';
        cell3.innerHTML = '<select name="type"><option>Roller banner</option><option>GrassHopper</option><option>Pop up display</option></select>';

    }
    function removerow() {
          document.getElementById("quote_form_table").deleteRow(-1);
    }
   </script>

我找到了许多关于如何添加类或Id的来源,但没有找到'name'。因此,在黑暗中疯狂刺伤我尝试了最后的尝试,看看我是否可以解决它。

var tr = tr.setAttribute("name", "row[]", 0);

现在我在这里。

表格行被制作成数组供PHP处理,以便可以通过电子邮件发送信息以获取报价,我可以按照正确的顺序在另一端生成信息。

我的问题是如何在动态生成的tr标签中添加row.name = "row[]";

甚至可能吗?

1 个答案:

答案 0 :(得分:3)

您想将name添加到新行,对吗?

var numRow = 0;

function addrow() {
    var table = document.getElementById("quote_form_table");
    var row = table.insertRow(-1);
    row.setAttribute("name", "row"+numRow);
    numRow++;
    var cell1 = row.insertCell(0);
    var cell2 = row.insertCell(1);
    var cell3 = row.insertCell(2);
    cell1.innerHTML = '<input type="text" name="quantity" >';
    cell2.innerHTML = '<select name="products"><option>Roller banner</option><option>GrassHopper</option><option>Pop up display</option></select>';
    cell3.innerHTML = '<select name="type"><option>Roller banner</option><option>GrassHopper</option><option>Pop up display</option></select>';
}

function removerow() {
    document.getElementById("quote_form_table").deleteRow(-1);
    numRow--;
}

但我认为您应该使用idclass代替<tr>元素的名称