29 lines
1.1 KiB
JavaScript
29 lines
1.1 KiB
JavaScript
var tabledata = [
|
|
{ id: 1, name: "Oli Bob", age: "12", col: "red", dob: "" },
|
|
{ id: 2, name: "Mary May", age: "1", col: "blue", dob: "14/05/1982" },
|
|
{ id: 3, name: "Christine Lobowski", age: "42", col: "green", dob: "22/05/1982" },
|
|
{ id: 4, name: "Brendon Philips", age: "125", col: "orange", dob: "01/08/1980" },
|
|
{ id: 5, name: "Margret Marmajuke", age: "16", col: "yellow", dob: "31/01/1999" },
|
|
];
|
|
|
|
|
|
// console.log('tabledata', tabledata);
|
|
import { TabulatorFull as Tabulator } from 'tabulator-tables';
|
|
|
|
var table = new Tabulator("#example-table", {
|
|
height: "311px",
|
|
data: tabledata, //assign data to table
|
|
layout: "fitColumns", //fit columns to width of table (optional)
|
|
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", hozAlign: "center" },
|
|
],
|
|
});
|
|
|
|
table.on("rowClick", function (e, row) {
|
|
alert("Row " + row.getData().id + " Clicked!!!!");
|
|
}); |