在按钮单击时包含下拉列表的表中添加新行

Question

我想在按钮点击上添加一个新行。 New Row将有一个文本框和一个下拉列表。下拉（选择元素）的选项将从会话属性添加。

我可以使用以下功能添加文本框。

    function addRow(btn) {         
        var parentRow = btn.parentNode.parentNode;
        var table = parentRow.parentNode;
        var rowCount = table.rows.length;

        var row = table.insertRow(rowCount);

        var cell1 = row.insertCell(0);
        var element1 = document.createElement("input");
        element1.type = "text";
        element1.name="abc";
        cell1.appendChild(element1);
        var cell3 = row.insertCell(1);
        var element2 = document.createElement("select");
        var option1 = document.createElement("option");
        option1.innerHTML = "Option1";
        option1.value = "1";
        element2.appendChild(option1, null);
    }

我有一个会话属性“类型”。我想将一个下拉列表作为其他列添加到要从类型添加选项的行。我在页面加载时设置属性“类型”。我在服务器端使用Java Servlet。任何帮助表示赞赏。

<c:forEach items="${types}" var="type">

Answer 1

如果你有会话属性“类型”，那么你可以这样做。发布您的剩余编码，以便我可以更新我的答案。

var Type = 'option 1';

function AddRow() {
    $('#tblTest').append(
        '<tr><td>' +
          '<input type="text" />' +
          '<select><option>' + Type + '</option></select>' +
        '</td></tr>');
}

<table id="tblTest">
    <tr>
        <td>
            <input type="text" name="data1" value="TempData" />
        </td>
        <td>
            <input type="button" value="Add" onclick="AddRow()" />
        </td>
    </tr>
</table>