Bikin fitur Update dan Delete pada tiap row
This commit is contained in:
parent
7c00802a77
commit
52afee5e25
43
js/data.js
43
js/data.js
@ -1,3 +1,7 @@
|
|||||||
|
function buttonAct(id) {
|
||||||
|
return `<button onclick="buttonEdit(${id})">Update</button> <button onclick="buttonRemove(${id})">Delete</button>`
|
||||||
|
}
|
||||||
|
|
||||||
var table = $('#table-list').DataTable({
|
var table = $('#table-list').DataTable({
|
||||||
"ajax": {
|
"ajax": {
|
||||||
"url": "http://localhost:11000/api/read",
|
"url": "http://localhost:11000/api/read",
|
||||||
@ -23,19 +27,19 @@ var table = $('#table-list').DataTable({
|
|||||||
{
|
{
|
||||||
"data": "name",
|
"data": "name",
|
||||||
"render": function(data, type, row) {
|
"render": function(data, type, row) {
|
||||||
return data;
|
return `<input id="form-edit-name-${row.id}" type="text" value="${data}">`;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"data": "phone",
|
"data": "phone",
|
||||||
"render": function(data, type, row) {
|
"render": function(data, type, row) {
|
||||||
return data;
|
return `<input id="form-edit-phone-${row.id}" type="text" value="${data}">`;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"data": null,
|
"data": null,
|
||||||
"render": function(data, type, row) {
|
"render": function(data, type, row) {
|
||||||
return `<button>Update</button> <button>Delete</button>`;
|
return buttonAct(row.id);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
@ -58,3 +62,36 @@ function buttonAdd() {
|
|||||||
}, "application/json");
|
}, "application/json");
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function buttonEdit(key){
|
||||||
|
var name = document.getElementById(`form-edit-name-${key}` ).value;
|
||||||
|
var phone = document.getElementById(`form-edit-phone-${key}` ).value;
|
||||||
|
var url = "http://localhost:11000/api/update";
|
||||||
|
var payload = {
|
||||||
|
"key" : key,
|
||||||
|
"name" : name,
|
||||||
|
"phone" : phone
|
||||||
|
};
|
||||||
|
sendHttpRequest(url, "POST", payload, function (error, response) {
|
||||||
|
if (error) console.error("Error:", error);
|
||||||
|
else {
|
||||||
|
table.ajax.reload(null, false); // false means keep the current page
|
||||||
|
console.log("JSON Response:", response);
|
||||||
|
}
|
||||||
|
}, "application/json");
|
||||||
|
alert("Data telah di Update");
|
||||||
|
}
|
||||||
|
|
||||||
|
function buttonRemove(key){
|
||||||
|
var url = "http://localhost:11000/api/delete";
|
||||||
|
var payload = {
|
||||||
|
"key" : key
|
||||||
|
};
|
||||||
|
sendHttpRequest(url, "POST", payload, function (error, response) {
|
||||||
|
if (error) console.error("Error:", error);
|
||||||
|
else {
|
||||||
|
table.ajax.reload(null, false); // false means keep the current page
|
||||||
|
console.log("JSON Response:", response);
|
||||||
|
}
|
||||||
|
}, "application/json");
|
||||||
|
alert("Data telah di Hapus Selamanya");
|
||||||
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user