NEW!Referensi istilah di supply chain dan logistik Buka di sini
Teknologi

Menggunakan Dua DataTable Pada Satu Halaman

1 Mins read
Dua DataTable Pada Satu Halaman

Kali ini saya sebagai programmer receh mau share tentang penggunaan dua data table pada satu halaman.

Namanya programmer receh, selalu ada aja hambatan pada saat ngoding. Maklumlah ilmu programming lulusan UCC (Universitas Coba-Coba) yang kuliahnya online (via mbah Google) dan “buku” wajibnya stackoverflow.

Nah kali ini saya dapat masalah nih waktu mau gunakan dua datatable pada satu halaman. Seperti ini nih tampilannya:

Dua DataTable Pada Satu Halaman

Di gambar yang saya capture ini terlihat saya menggunakan dua datatables. Datatable yang sebelah kiri normal, sementara yang sebelah kanan “wora umum” karena ada beberapa bagian yang hilang, seperti contohnya bagian “search”.

Waduhhh, kok bisa begini ya? padahal sudah aku copas dengan seksama dan dalam tempo sesingkat-singkatnya.

Akhirnya dengan menggunakan kata kunci “2 datatables on same page” di halaman pencarian punya mbah Google, saya dapatlah kunci jawabannya di kitab besar para programmer stackoverflow.

Oke mari kita coba.

Awalnya coding bagian datatable saya seperti ini. Sorry gak saya masukin di sini alias disnippet di halaman ini, karena tampilannya jadi acak adul. Nah berdasar kitab stack overflow tadi, maka kita harus menambahkan kode berikut ini.

$(document).ready(function() {
    $('table.display').DataTable();
} );

Tampaknya kode itu seperti javascript, ah memang iya kok, hehehe. itu JQuery. Okelah, kalau begitu saya tambahkan aja di bawah kode yang ada dua datatable tadi. Hanya saya sedikit modifikasi menyesuaikan dengan nama class dari table-nya. Pada contoh menggunakan class display, kalau di tempat saya pakai class table. okelah….

$(document).ready(function() {
    $('table.table').DataTable();
} );

Nah, di bagian kode yang memuat datatable juga kita rubah. Rubahnya sedikit aja sih. Awalnya table kita ada id-nya, karena hasil copas dari adminLTE. Nah kita tinggal hilangkan kedua id-nya aja. Link perubahan kodenya ada di sini ya.

Baca Juga   Menampilkan Page View Dari Google Analytics di wordpress

Dan woilaaaa, kedua datatable ditampilkan secara normal

Dua DataTable Pada Satu Halaman

Oke deh, itu tips saya sebagai programmer receh untuk menggunakan dua DataTable pada satu halaman, jangan marah apalagi berduka karena sudah terlanjur buka halaman ini ya.

By the way, ini ada link receh, siapa tahu butuh tips receh tentang programming lainnya.

Artha Nugraha Jonar

About author
Saat ini bekerja di perusahaan logistik. Sedang belajar bahasa pemrograman komputer. Hobi jalan-jalan, makan dan bersepeda.
Articles
Related posts
Teknologi

Merubah format time picker di adminLTE 2 sebelum di simpan di database (PHP)

1 Mins read
Beberapa aplikasi yang saya buat menggunakan adminLTE. Ini seperti admin template sejuta umat. Bahkan template yang profesional-pun banyak yang dikembangkan dari adminLTE….
Teknologi

Pakai method isClean() Untuk Cek Ada Perubahan Pada Data yang Diupdate

1 Mins read
method isClean() ini saya pakai pada saat melakukan pengecekan apakah data yang diparsing melalui request ada perubahan. Jika tidak ada perubahan, berarti…
Teknologi

Mengatasi Warning Use of undefined constant REQUEST_URI Pada Saat Update Wordpress

1 Mins read
Biasanya di hari sabtu saya melakukan maintenance website dan aplikasi yang dipergunakan di kantor. Maintenance yang saya lakukan biasanya meliputi pemeriksaan traffict,…

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *

This site uses Akismet to reduce spam. Learn how your comment data is processed.