istek-widuri/widuri-client
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Bikin fitur Update dan Delete pada tiap row

Browse Source
This commit is contained in:
Dita Aji Pratama 2025-06-17 11:05:03 +07:00
parent 7c00802a77
commit 52afee5e25
1 changed files with 40 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
js/data.js
View File

@ -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({
"ajax": {
"url": "http://localhost:11000/api/read",
@ -23,19 +27,19 @@ var table = $('#table-list').DataTable({
{
"data": "name",
"render": function(data, type, row) {
return data;
return `<input id="form-edit-name-${row.id}" type="text" value="${data}">`;
}
},
{
"data": "phone",
"render": function(data, type, row) {
return data;
return `<input id="form-edit-phone-${row.id}" type="text" value="${data}">`;
}
},
{
"data": null,
"render": function(data, type, row) {
return `<button>Update</button> <button>Delete</button>`;
return buttonAct(row.id);
}
},
],
@ -58,3 +62,36 @@ function buttonAdd() {
}, "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");
}