UtamaBeritaTutorialBlogTool

Google
Your Ad Here

Google
Web ilmuit.com
Tutorial Kategori Menambah row dan column dalam table menggunakan javascript

Menambah row dan column dalam table menggunakan javascript

Oleh sufian_yusuff
Dikirim pada Wednesday 21 March 2007



Javascript ini boleh menambah row dan column ke dalam table sedia ada.

Masukkan Javascript ini dibahagian HEAD

KOD
<script type="text/javascript">

// Skrip untuk tambah column dalam table sedia ada
function simpanData(namaTable) {

var A = document.getElementById("nama").value
var B = document.getElementById("tel").value
var C = document.getElementById("tel2").value
var D = document.getElementById("hp").value
var E = document.getElementById("alamat").value

var tbl = document.getElementById('namaTable');
var newRow = document.getElementById('namaTable').insertRow(tbl.rows.length);

var V = newRow.insertCell(0)
var W = newRow.insertCell(1)
var X = newRow.insertCell(2)
var Y = newRow.insertCell(3)
var Z = newRow.insertCell(4)

//display html
V.innerHTML= A
V.align="center"
W.innerHTML= B
W.align="center"
X.innerHTML= C
X.align="center"
Y.innerHTML= D
Y.align="center"
Z.innerHTML= E
Z.align="center"


}

</script>



Berikut contoh kod HTML. Masukkan ke bahagian BODY

KOD
<h1>Contoh Skrip untuk menambah row dan column dengan menggunakan javascript</h1>

<table id="namaTable" cellspacing='0' width='100%' style='border: 1px solid grey;border-collapse:collapse;' border='1'>
<tr>
<th>Nama</td>
<th>No. Telefon Rumah</th>
<th>No. Telefon Pejabat</th>
<th>No. Telefon Bimbit</th>
<th>Alamat Pejabat</th>
</tr>
</table>
<br><br>
<table cellspacing='0'>
<tr><td>Nama</td><td>:</td><td><input type="text" size="15" id="nama" value="Mohd Safuan"></td></tr>
<tr><td>No. Telefon Rumah</td><td>:</td><td><input type="text" size="15" id="tel" value="03-3456789"></td></tr>
<tr><td>No. Telefon Pejabat</td><td>:</td><td><input type="text" size="15" id="tel2" value="03-12222221"></td></tr>
<tr><td>No. Telefon Bimbit</td><td>:</td><td><input type="text" size="15" id="hp" value="013-34444443"></td></tr>
<tr><td>Alamat Pejabat</td><td>:</td><td><textarea cols="15" rows="5" id="alamat">C12-9, Jalan Rahmat, Taman Besraya, 12300 Shah Alam Selangor. </textarea></td></tr>
<tr><td colspan="3" align="center">
<input type="button" value="simpan" onClick="simpanData('namaTable')" size="20"></td></tr>
</table>


selamat mencuba!!





email to someone printer friendly
Senarai tutorial dalam kategori ini
Kembali ke laman utama tutorial

Penilaian
Belum ada penilaian dibuat setakat ini


Sila Log-in untuk menghantar komen. Daftar jika belum menjadi ahli.



Artikel Terbaru

Photorec : Memulihkan Data Yang Dipadam Secara Tidak Sengaja
Software ini berupaya mengembalikan data yang telah di padam atau media yang terformat secara tidak sengaja.

Mengesan jenis Kad Grafik


Antaramuka Shutdown
Menutup (Shutdown) dan memulakan semula (Restart) komputer melalui dialog.

Pintasan Hibernasi
Membuat pintasan (shortcut) hibernasi

Mengembalikan ikon "Show Desktop"
Cara untuk mengembalikan ikon "Show Desktop" di Quick Launch Bar


Google Button
Hakcipta terpelihara, © IlmuIT.com.
Semua artikel yang terkandung di dalam web ini dikreditkan kepada penulis asal.
Jumlah Ahli: 1696 | Jumlah Artikel: 379
Tutorial - Reviu - Blog - Tool - Carian - Direktori
Kredit :: Hubungi ::Iklan :: Polisi :: Rakan :: Forum :: RSS
Bahan RSS
Advertise on this site
Render time: 0.1339 second(s).