Friday, February 26

Membuat Textfield dinamis

Maksud dari dinamis textfield adalah kita bisa menambahkan textfield secara otomatis sesuai dengan angka yang kita masukkan. Misalnya kita memasukkan angka lima, maka secara otomatis akan tercipta textfield sejumlah 5 buah. Scriptnya adalah sebagai berikut:



<html>
<head>
<SCRIPT language="javascript">

function addRow(tableID) {

var table = document.getElementById(tableID);

//jumlah kelompok
var jumlah = document.getElementById("jumlah");

var rowCount = table.rows.length;
var j=jumlah.value;

for(i = 0; i < jumlah.value; i++){


var row = table.insertRow(rowCount);

var cell1 = row.insertCell(0);
//cell1.innerHTML = "-";

var cell1 = row.insertCell(1);
cell1.innerHTML = "Nama "+ j;

var cell3 = row.insertCell(2);
var element2 = document.createElement("input");
element2.type = "text";
element2.name = "nama"+i;
cell3.appendChild(element2);


j--;


}

}

</head>
<body>
<form id="coba" method="post" action="proses.php">
<TABLE id="dtTable" name="dtTable" width="450px" border="0">
<INPUT type="text" name="jumlah" id="jumlah"/>
<INPUT type="button" value="Add" onclick="addRow('dtTable')" />
</TABLE>
<input type=submit value=sumbmit>
</form>
</body>
</html>


Silahkan download file di sini

2 comments:

  1. saya sudah mencoba script ini, dan berhasil... makasi ya... tapi ada satu pertanyaan lagi nih... bisa bantu tidak? nah semisal ingin menyimpan isi dari text field yang telah dimunculkan untuk disimpan ke database, bagaimana? maaf, saya belum paham javascript... dan contoh yang diberikan kurang lengkap masalah koneksi database dan tidak ada contoh file database(.sql) nya. mohon bantuannya.... trims.

    ReplyDelete
  2. yg jadi pertanyaan gimana sich script buat menyimpan isi dari textfield yg sudah dibuat?

    ReplyDelete

Pencarian Google