如何在单击 PHP 中的按钮时动态插入列表框？
Posted
技术标签:
【中文标题】如何在单击 PHP 中的按钮时动态插入列表框？【英文标题】：How to insert list box dynamically on click of a button in PHP? 【发布时间】：2018-01-02 23:54:35 【问题描述】：我想创建一个表格，用于向数据库中插入多行数据。我有一个可以插入数字的字段，然后单击“添加”按钮。没有记录将添加到表中。
我现在可以根据插入的行数添加记录数。但我希望 Floor_id 字段是连续数字，而它只是 copyig 第一个字段。
任何人都可以指导如何将第一个字段作为增量数字。
代码片段
function addRow(tableID,num)
var num = $("#rownum").val();
$("#dataTable tr").slice(2).remove();
for (var n = 2; n <= num; n++)
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
var row = table.insertRow(rowCount);
var colCount = table.rows[0].cells.length;
for(var i=0; i<colCount; i++)
var newcell = row.insertCell(i);
newcell.innerhtml = table.rows[1].cells[i].innerHTML;
//alert(newcell.childNodes);
switch(newcell.childNodes[1].type)
case "text":
newcell.childNodes[1].value = "";
break;
case "select-one":
newcell.childNodes[1].selectedIndex = 0;
break;
<HTML>
<HEAD>
<TITLE> Add/Remove dynamic rows in HTML table </TITLE>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
</HEAD>
<BODY>
<div class="results"></div>
<fieldset style="width: 1600px;">
<legend><b>Building Layout Info</b></legend>
<TABLE id="dataTable" border="1">
<tr>
<th>Floor_Id</th>
<th>Front_F_Mark </th>
<th>Rear_F_Mark</th>
<th>Floor_Type</th>
</tr>
<TR>
<td><input type= "text" name= "Floor_Id[]" value="1" /> </td>
<td><input type= "text" name= "Front_F_Mark[]" /> </td>
<td><input type= "text" name= "Rear_F_Mark[]" /> </td></td>
<td><select name="Floor_Type[]" id="Floor_Type" > <br />
<option value="">Floor_Type </option>
<option value="Normal">Normal</option>
<option value="Hidden">Hidden</option> </select>
</select>
</td>
</TR>
<labe>Number of Records<input class="row" type='text' id='rownum' name='rownum' /> </label>
<INPUT type="button" value="Add Row" onclick="addRow('dataTable');" />
</TABLE>
</body>
</html>【问题讨论】：
欢迎来到 SO。请访问 help center 并参观以了解询问内容和方法。提示：邮政编码和努力—— @bub 感谢您提到这一点。更新相同。 @ItamarG3 你能帮忙看看如何添加列表框，因为它在这里只添加文本框。我的列表框正在通过 PDO 获取数据.. 【参考方案1】：我能够通过以下更改来实现这一点。
<HTML>
<HEAD>
<TITLE> Add/Remove dynamic rows in HTML table </TITLE>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
</HEAD>
<BODY>
<div class="results"></div>
<fieldset style="width: 1600px;">
<legend><b>Building Layout Info</b></legend>
<TABLE id="dataTable" border="1">
<tr>
<th>Floor_Id</th>
<th>Front_F_Mark </th>
<th>Rear_F_Mark</th>
<th>Floor_Type</th>
</tr>
<TR>
<td><input type= "text" name= "Floor_Id[]" value="1" /> </td>
<td><input type= "text" name= "Front_F_Mark[]" /> </td>
<td><input type= "text" name= "Rear_F_Mark[]" /> </td></td>
<td><select name="Floor_Type[]" id="Floor_Type" > <br />
<option value="">Floor_Type </option>
<option value="Normal">Normal</option>
<option value="Hidden">Hidden</option> </select>
</select>
</td>
</TR>
<labe>Number of Records<input class="row" type='text' id='rownum' name='rownum' /> </label>
<button type="button" class='loadfloor' style="float: right;"> Load Floors</button>
</TABLE>
</form>
<script>
$(".loadfloor").on('click',function()
var num = $("#rownum").val();
$("#dataTable tr").slice(2).remove();
for (var i = 2; i <= num; i++)
var data = "<tr><td><input type='text' id='Floor_Id"+i+"' name='Floor_Id[]' value = "+i+" /></td><td><input type='text' id='Front_F_Mark"+i+"' name='Front_F_Mark[]'/></td><td><input type='text' id='Rear_F_Mark"+i+"' name='Rear_F_Mark[]'/></td><td><select id='Floor_Type"+i+"' name='Floor_Type[]'><option value='null'>Floor_Type</option><option value='Normal'>Normal</option><option value='Hidden'>Hidden</option></td></tr>";
$("#dataTable").append(data);
);
</script>
</body>
</html>
【讨论】：
以上是关于如何在单击 PHP 中的按钮时动态插入列表框？的主要内容，如果未能解决你的问题，请参考以下文章
单击 jquery-tabledit 中的编辑按钮时如何启用选择框？