tabulator-table

resources/js/tabulator-js.js

@@ -0,0 +1,29 @@
+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!!!!");
+});