我有一个项目,我必须创建表单,用户可以在其中添加教育。 我成功地使用(仅)输入动态添加和删除,但是当我在其中放入下拉列表时,我遇到了问题。 代码是有效的,但是当我点击我的下拉列表时,我无法获得任何选项。
请看截图: https://www.dropbox.com/s/q58ic9jvq2sqofh/Capture.JPG
HTML
<h3>Pendidikan</h3>
<table id="pendidikan">
<input type="button" value="Tambah Data" onClick="addRow('pendidikan')" />
<input type="button" value="Hapus Data" onClick="deleteRow('pendidikan')" />
<thead>
<tr>
<th></th>
<th>Jenjang</th>
<th>Nama Institusi</th>
<th>Kota</th>
<th>Tahun</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<input type="checkbox" name="chk[]"/>
</td>
<td>
<select name="jenjang[]">
<option value="sd">Sekolah Dasar</option>
<option value="smp">Sekolah Menengah Pertama</option>
<option value="sma">Sekolah Menengah Atas</option>
<option value="d3">Perguruan Tinggi (D3)</option>
<option value="s1">Perguruan Tinggi (D4/S1)</option>
<option value="s2">Perguruan Tinggi (S2)</option>
<option value="s3">Perguruan Tinggi (S3)</option>
</select>
</td>
<td>
<input id="pendidikan" name="pendidikan[]"type="text" size="30" maxlength="30"/>
</td>
<td>
<input id="pendidikanDi" name="pendidikanDi[]" style="width: 200px;" type="text" size="30" maxlength="30"/>
</td>
<td>
<input id="pendidikanTahun" name="pendidikanTahun[]" style="width: 200px;"type="text" size="30" maxlength="30"/>
</td>
</tr>
</tbody>
</table>
的Javascript
function addRow(tableID) {
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
var row = table.insertRow(rowCount);
var cell1 = row.insertCell(0);
var element1 = document.createElement("input");
element1.type = "checkbox";
element1.name="chkbox[]";
cell1.appendChild(element1);
var cell2 = row.insertCell(1);
var element2 = document.createElement("select");
element2.name="jenjang[]";
cell2.appendChild(element2);
var cell3 = row.insertCell(2);
var element3 = document.createElement("input");
element3.type = "text";
element3.name = "pendidikan[]";
cell3.appendChild(element3);
var cell4 = row.insertCell(3);
var element4 = document.createElement("input");
element4.type = "text";
element4.name = "pendidikanDi[]";
cell4.appendChild(element4);
var cell5 = row.insertCell(4);
var element5 = document.createElement("input");
element5.type = "text";
element5.name = "pendidikanTahun[]";
cell5.appendChild(element5);
}
function deleteRow(tableID) {
try {
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
for(var i=0; i<rowCount; i++) {
var row = table.rows[i];
var chkbox = row.cells[0].childNodes[0];
if(null != chkbox && true == chkbox.checked) {
table.deleteRow(i);
rowCount--;
i--;
}
}
}catch(e) {
alert(e);
}
}
感谢您的进步!