Di HTML kita bisa menambah dan menghapus row secara dinamis dengan bantuan Javascript.
Seperti tampilan di bawah ini.
Contoh source code nya seperti di bawah ini :
<html>Untuk menambah row secara dinamis, kita menggunakan method insertRow(), sedangkan untuk menghapus row menggunakan method deleteRow(), sedangkan untuk membuat cell baru kita menggunakan method row.insertCell().
<head>
<script language="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 element3 = document.createElement("input");
element3.type = "text";
element3.name = "txtbox[]";
cell2.appendChild(element3);
var cell3 = row.insertCell(2);
var element2 = document.createElement("input");
element2.type = "text";
element2.name = "txtbox[]";
cell3.appendChild(element2);
}
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);
}
}
</script>
</head>
<body>
<input onclick="addRow('dataTable')" type="button" value="Tambah" />
<input onclick="deleteRow('dataTable')" type="button" value="Hapus" />
<div style="padding: 20px 0px 0px 0px;">
<table id="dataTable" style="border-bottom: 1px solid #F00; border-left: 1px solid #F00; border-right: 1px solid #F00; border-top: 1px solid #F00; width: 350pxpx;">
<tr>
<td><input name="chk" type="checkbox" /></td>
<td> <input type="text" /> </td>
<td> <input type="text" /> </td>
</tr>
</table>
</div>
</body>
</html>
Semoga Bermanfaat :)
Thanks for Viral :) https://twitter.com/viralpatelnet
Update Contact :
No Wa/Telepon (puat) : 085267792168
No Wa/Telepon (fajar) : 085369237896
Email : Fajarudinsidik@gmail.com
No Wa/Telepon (puat) : 085267792168
No Wa/Telepon (fajar) : 085369237896
Email: Fajarudinsidik@gmail.com
atau Kirimkan Private messanger melalui email dengan klik tombol order dibawah ini :
