when updating ,field date not showing the date value.
when updating ,field date not showing the date value.
adelkanso
Posts: 2Questions: 1Answers: 0
DataTable Editor
when updating ,field date not showing the date value.
this is my code :
``` $('.page-header').html('Stock');
$('thead tr').append($('<th />', { text: 'Product' }));
$('thead tr').append($('<th />', { text: 'Merchant' }));
$('thead tr').append($('<th />', { text: 'Weight' }));
$('thead tr').append($('<th />', { text: 'Price /$' }));
$('thead tr').append($('<th />', { text: 'Quantity' }));
$('thead tr').append($('<th />', { text: 'Width' }));
$('thead tr').append($('<th />', { text: 'Height' }));
$('thead tr').append($('<th />', { text: 'Thickness' }));
$('thead tr').append($('<th />', { text: 'Date of purchase' }));
$('#table').on('click', 'tr', function () {
try {
row_id = table.row(this).data().id;
editor.s.ajax.edit.url = '/api/stocks';
editor.s.ajax.remove.url = '/api/stocks';
} catch (e) {
}
});
var table = $('#table').DataTable({
"autoWidth": true,
'responsive': true,
"ajax": {
"url": "/api/stocks",
"type": "GET",
},
"columns": [{
data: null,
render: function (data, type, row) {
if (data.product.subtype == "") {
return data.product.name;
}
return data.product.name + ', ' + data.product.subtype;
},
editField: ['product.name', 'product.subtype']
},
{ "data": "merchant.name" },
{ "data": "weight" },
{ "data": "price" },
{ "data": "quantity" },
{ "data": "width" },
{ "data": "height" },
{ "data": "thickness" },
{ "data": "dop" }
],
'bPaginate': false,
'select': true,
"bInfo": false,
"bLengthChange": false,
});
editor = new $.fn.dataTable.Editor({
ajax: {
create: {
type: 'POST',
url: '/api/stocks',
data: function (d) {
d.product_id = $("#DTE_Field_product_id").val();
d.merchant_id = $("#DTE_Field_merchant_id").val();
d.weight = $("#DTE_Field_weight").val();
d.price = $("#DTE_Field_price").val();
d.quantity = $("#DTE_Field_quantity").val();
d.width = $("#DTE_Field_width").val();
d.height = $("#DTE_Field_height").val();
d.thickness = $("#DTE_Field_thickness").val();
d.dop = $("#DTE_Field_dop").val();
delete d.data;
delete d.action;
},
success: function () {
$.notify('New Stock added.', 'success');
table.ajax.reload();
},
error: function (response) {
var json = $.parseJSON(response.responseText);
for (var key in json) {
$.notify(json[key]);
}
}
},
edit: {
type: 'PATCH',
url: '/api/stocks',
data: function (d) {
d.id = row_id;
d.product_id = $("#DTE_Field_product_id").val();
d.merchant_id = $("#DTE_Field_merchant_id").val();
d.weight = $("#DTE_Field_weight").val();
d.price = $("#DTE_Field_price").val();
d.quantity = $("#DTE_Field_quantity").val();
d.width = $("#DTE_Field_width").val();
d.height = $("#DTE_Field_height").val();
d.thickness = $("#DTE_Field_thickness").val();
d.dop = $("#DTE_Field_dop").val();
delete d.data;
delete d.action;
},
success: function () {
$.notify('Stock updated.', 'success');
table.ajax.reload();
},
error: function (response) {
var json = $.parseJSON(response.responseText);
for (var key in json) {
$.notify(json[key]);
}
}
},
remove: {
type: 'DELETE',
url: '/api/stocks',
data: function (d) {
d.id = row_id;
delete d.data;
delete d.action;
},
success: function () {
$.notify('Stock has been trashed.', 'success');
table.ajax.reload();
},
error: function (response) {
var json = $.parseJSON(response.responseText);
for (var key in json) {
$.notify(json[key]);
}
}
}
},
table: "#table",
'idSrc': 'id',
fields: [{
label: "Product:",
name: "product_id",
type: "select"
}, {
label: "Merchant:",
name: "merchant_id",
type: "select"
}, {
label: "Weight:",
name: "weight",
attr: {
"type": "number"
}
}, {
label: "Price /$:",
name: "price",
attr: {
"type": "number"
}
}, {
label: "Quantity:",
name: "quantity",
attr: {
"type": "number"
}
}, {
label: "Width:",
name: "width",
attr: {
"type": "number"
}
}, {
label: "Height:",
name: "height",
attr: {
"type": "number"
}
}, {
label: "Thickness:",
name: "thickness",
attr: {
"type": "number"
}
}, {
label: "Date of Purchase:",
name: "dop",
type: "date",
attr: {
"placeholder": "DD-MM-YYYY"
},
def: function () { return new Date(); },
dateFormat: "DD-MM-YYYY",
}],
i18n: {
create: {
title: "Add Stock"
},
edit: {
title: "Edit Stock"
},
remove: {
title: "Trash Stock"
}
}
});
$.ajax({
url: '/api/stockInfo',
type: 'GET',
data: {},
success: function (response) {
response = $.parseJSON(response);
var stock_product = [];
var stock_merchant = [];
var products = response['data']['products'];
var merchants = response['data']['merchants'];
for (var i = 0; i < products.length; i++) {
stock_product.push({ label: products[i]['name'] + ' - ' + products[i]['subtype'], value: products[i]['id'] });
}
for (var i = 0; i < merchants.length; i++) {
stock_merchant.push({ label: merchants[i]['id'] + ' - ' + merchants[i]['name'], value: merchants[i]['id'] });
}
editor.field('product_id').update(stock_product);
editor.field('merchant_id').update(stock_merchant);
},
error: function () {
$.notify('There was an error fetching product & merchant data.');
}
});
new $.fn.dataTable.Buttons(table, [
{ extend: "create", className: 'btn btn-success btn-outline Btn', editor: editor },
{ extend: "edit", className: 'btn btn-primary btn-outline Btn', editor: editor },
{
extend: "remove",
className: 'btn btn-danger btn-outline Btn',
editor: editor,
formMessage: function (e, dt) {
return 'Are you sure you want to trash the stock?';
}
}
]);
table.buttons().container()
.appendTo($('.col-sm-6:eq(0)', table.table().container()));
```
This discussion has been closed.
Answers
Does it work when you create the date originally? Are you seeing errors? Does it communicate with the server? Please can you provide more details, and if possible, link to your page so we can take a look.
Colin
Does it work when you create the date originally? yes it works
Are you seeing errors?not t all
Does it communicate with the server?yes
link to your page so we can take a look. """it's not an online page
So the create action works, and the
table.ajax.reload();is called.Is your
table.ajax.reload();call executed in thesuccesscallback after the edit action?Allan