JSFiddle - React, Tailwind, and code Playground
JavaScript
var editor;
var table;
$(document).ready(function() {
function loader(url) {
var j = "";
$.ajax({
url: url,
async: false,
dataType: 'json',
cache: false,
success: function (json) {
j = json;
}
});
return j;
}
editor = new $.fn.dataTable.Editor( {
ajax: {
create: {
type: 'POST',
url: '/api/ordersystem/joborder/add',
contentType: 'application/json',
data: function ( data ) {
return JSON.stringify( data );
}
},
edit: {
type: 'POST',
url: '/api/ordersystem/joborder/update',
contentType: 'application/json',
data: function ( data ) {
return JSON.stringify( data );
}
},
remove: {
type: 'DELETE',
url: '../php/rest/remove.php?id=_id_'
}
},
table: "#joborder",
idSrc: "transId",
fields: [{
name: "transId",
type: "hidden"
}, {
name: "customerId",
type: "hidden"
}, {
label: "Customer Name",
name: "customerName",
type: "select2",options: [{}]
}, {
label: "Celebrant Name",
name: "celebrantName",
attr: {placeholder: "John Doe"}
}, {
label: "Age",
name: "celebrantAge",
type: "mask",
mask: "000",
placeholder: "Age"
}, {
label: "Delivery Address",
name: "deliveryAddress",
attr: {placeholder: "Fraser Place Manila"}
}, {
label: "Delivery Date",
name: "deliveryDate",
type: "datetime",
format: "MM/DD/YYYY HH:mm"
}, {
label: "Order Date",
name: "orderDate",
type: "datetime",
format: "MM/DD/YYYY"
}, {
label: "Particulars",
name: "remark",
}, {
label: "Product Price",
name: "amount",
attr: {placeholder: "Amount"}
}, {
label: "Delivery Fee",
name: "deliveryFee",
attr:...