0
我正在尝试创建一个可以根据需要动态地向表中添加更多行的表单。在我将发布的示例中,您将看到一个伴侣表的表格。因为,我们不知道每个学校会带来多少伴侣,因此需要充满活力。我正在尝试使用Javascript来创建一个onclick按钮,它将在表中添加一个新行并将这些名称存储为一个数组,以便它可以发送POST和使用PHP进行分析,然后存储到数据库中。我在网上找到了一个解决方案,但是当我尝试在我的网站上实现它时,一旦单击按钮,就没有任何工作。也许我只需要另一双眼睛来看看它是否需要任何东西。动态行以表格的形式
<table id="chp" class="table table-striped">
<tr>
<th class="text-center">First Name</th>
<th class="text-center">Last Name</th>
<th class="text-center">Phone</th>
<th class="text-center">Email</th>
<th class="text-center"> + </th>
</tr>
<tr>
<td><input id="chpFirst" name="chpFirst" type="text" placeholder="John" class="form-control input-md" required=""></td>
<td><input id="chpLast" name="chpLast" type="text" placeholder="Doe" class="form-control input-md" required=""></td>
<td><input id="chpPhone" name="chpPhone" type="text" placeholder="5555555555" class="form-control input-md" required=""></td>
<td><input id="chpEmail" name="chpEmail" type="text" placeholder="[email protected]" class="form-control input-md" required=""></td>
<td><input type="button" id="more_fields" onclick="add_chp();" value="Add" class="btn btn-info" /></td>
</tr>
</table>
<script>
function add_chp() {
document.getElementByID("chp").insertRow(-1).innerHTML = '<tr>' +
'<td><input id="chpFirst" name="chpFirst[]" type="text" placeholder="John" class="form-control input-md" required=""></td>' +
'<td><input id="chpLast" name="chpLast[]" type="text" placeholder="Doe" class="form-control input-md" required=""></td>' +
'<td><input id="chpPhone" name="chpPhone[]" type="text" placeholder="5555555555" class="form-control input-md" required=""></td>' +
'<td><input id="chpEmail" name="chpEmail[]" type="text" placeholder="[email protected]" class="form-control input-md" required=""></td>' +
'<td><input type="button" id="more_fields" onclick="add_fields();" value="Add More" class="btn btn-info" /></td>' +
'</tr>';
}
</script>
https://jsfiddle.net/owk9ct13/
它应该是'document.getElementById(“chp”)' – Dij