Script Menghitung Baris Table dengan Penomoran Otomatis

Script Menghitung Baris Table dengan Penomoran Otomatis. Sebenarnya cukup sulit bagi saya untuk menemukan referensi yang tepat di kala melakukan programming. Programming yang dilakukan kali ini adalah untuk keperluan menambahkan kolom secara otomatis. Selain kolom otomatis, juga di tambahkan penomorannya.

Script Menghitung Baris Table dengan Penomoran Otomatis

Sebenarnya artikel ini lebih tepatnya saya tujukan untuk pengingat. Ada latar belakang mengapa saya selaku admin areablogger melakukan programming. Ini adalah berkaitan dengan proyek membuat sebuah admin untuk situs kontes SEO.

Saya adalah seorang yang mudah lupa. Tentu saja hal ini membuat saya perlu membuat catatan-catatan di kala menyelesaikan sesuatu. Catatan-catatan ini seringkali saya lupa letakkan di folder apa.

Ketika lupa letaknya, saya malas mencari lagi. Saya biasanya search / cari di mesin pencari / google. Hal ini tentunya memakan waktu lagi, apalagi penyelesaian masalahnya sebenarnya sangat sederhana.

Well, kali ini saya punya satu script yang saya share di sini untuk nantinya jika saya perlukan bisa saya gunakan. Artinya, saya juga tidak perlu menghabiskan waktu mencari di google untuk menemukan script ini.

Script ini saya dapatkan dari pencarian di situs stackoverflow. Situs stackoverflow sangatlah bagus bagi para programmer. Tanya jawab di situs ini seringkali memberikan solusi yang lengkap dengan disertai jawaban / deskripis.

Script Menghitung Baris Table dengan Penomoran Otomatis
Script ketika berhasil berfungsi

Ini scriptnya:


< script type="text/javascript">
var addNumeration = function(cl){
  var table = document.querySelector('table.' + cl)
  var trs = table.querySelectorAll('tr')
  var counter = 1
  
  Array.prototype.forEach.call(trs, function(x,i){
    var firstChild = x.children[0]
    if (firstChild.tagName === 'TD') {
      var cell = document.createElement('td')
      cell.textContent = counter ++
      x.insertBefore(cell,firstChild)
    } else {
      firstChild.setAttribute('colspan',1)
    }
  })
}

addNumeration("table")
< /script>

Hapus spasi di antara kode < script type="text/javascript"> dan < /script> untuk membuat script ini berjalan di halaman HTML Anda.

Cara Kerja Script Menghitung Baris Table dengan Penomoran Otomatis

1. Script akan mencari tag HTML Table.
2. Setelah menemukannya, script akan melakukan query pada tag TR (table row / baris table) di dalam Table.
3. Script akan membuat tag TD sebagai baris paling pertama dari tag TR.
4. Script akan menghitung berapa jumlah dari tag TD pada table.
5. Script akan memasukkan nomor dari tag TD paling pertama secara berurut sampai tag TD paling akhir.

Setelah selesai, Anda akan mendapatkan satu kolom per baris yang berisi urutan baris kolom pada table. Script ini sangat berguna untuk mengurutkan data yang di query (diambil) dari database ke dalam tag HTML Table.

Masih bisa ditambahkan beberapa fitur dalam script ini. Tetapi pada artikel ini cukuplah saya bahas demikian. Oh iya, agar tidak di nomori pada baris paling awal, maka gunakan tag TH (Table Header) sebagai judul dari kolom.

Ada pertanyaan?

Tinggalkan Balasan