Senin, 09 Maret 2020

Apa Itu Tabulator?

Tabulator adalah JavaScript library untuk membuat Tabel Kompleks dengan Kode Sederhana. Tabulator memungkinkan membuat tabel interaktif dalam hitungan detik dari Tabel HTML apa saja, JavaScript Array, sumber data AJAX atau data berformat JSON. Cukup sertakan library tabulator dalam proyek website dan anda siap pergi!

Persiapan

Tambahkan Tabulator library dan style sheet:
<link href="dist/css/tabulator.min.css" rel="stylesheet">
<script type="text/javascript" src="dist/js/tabulator.min.js"></script>


Tambahkan elemen HTML untuk menampung table Tabulator HTML<div id="example-table"></div>

Tambahkan beberapa data di Tabulator
var table = new Tabulator("#example-table", {
    height:"311px",
    columns:[
    {title:"Name", field:"name"},
    {title:"Progress", field:"progress", sorter:"number"},
    {title:"Gender", field:"gender"},
    {title:"Rating", field:"rating"},
    {title:"Favourite Color", field:"col"},
    {title:"Date Of Birth", field:"dob", align:"center"},
    ],
});



Ubah elemen menjadi konstruktor elemen
//create Tabulator on DOM element with id "example-table"
var table = new Tabulator("#example-table", {
     height:205, // set height of table (in CSS or here),     data:tabledata, //assign data to table
     layout:"fitColumns", //fit columns to width of table (optional)
     columns:[ //Define Table Columns
         {title:"Name", field:"name", width:150},
         {title:"Age", field:"age", align:"left", formatter:"progress"},
         {title:"Favourite Color", field:"col"},
         {title:"Date Of Birth", field:"dob", sorter:"date", align:"center"},
     ],
     rowClick:function(e, row){ //trigger an alert message when the row is clicked
         alert("Row " + row.getData().id + " Clicked!!!!");
     },
});


referensi:
http://tabulator.info/

Segera bergabung : - kursus bahasa Inggris - kursus komputer dengan: Lembaga Pendidikan Indonesia Amerika ( LPIA ); Alamat LPIA Margonda Jl. Margonda Raya, No.91C (dekat lampu merah flyover pertigaan Arief Rahman Hakim atau depan Autopart Ramanda Depok, sebelah Solite Furniture dan ATTIN TOUR); Kelurahan: Pancoran Mas; Kecamatan : Pancoran Mas; Kota: Depok; Po Box: 16431; Telepon LPIA Depok : (021) 7774443

Tidak ada komentar:

Posting Komentar


Bagi kamu yang lagi belajar bahasa Inggris dan belajar komputer atau sedang berada dekat LPIA (kursus bahasa Inggris dan kursus komputer).
LPIA menerima pendaftaran siswa baru dan siswa lanjut untuk kursus bahasa Inggris dan kursus Komputer. Yuk, mendaftar!!!