diff --git a/index.html b/index.html index 1f037a2..3f28a6b 100644 --- a/index.html +++ b/index.html @@ -4,9 +4,9 @@ - - - + + +
diff --git a/js/data.js b/js/data.js index f00825a..49621fa 100644 --- a/js/data.js +++ b/js/data.js @@ -1,3 +1,7 @@ +function buttonAct(id) { + return `` +} + var table = $('#table-list').DataTable({ "ajax": { "url": "http://localhost:11000/api/read", @@ -23,20 +27,62 @@ var table = $('#table-list').DataTable({ { "data": "name", "render": function(data, type, row) { - return data; + return ``; } }, { "data": "phone", "render": function(data, type, row) { - return data; + return ``; } }, { "data": null, "render": function(data, type, row) { - return ``; + return buttonAct(row.id); } }, ], }) + +function buttonAdd() { + var name = document.getElementById("form-add-name").value; + var phone = document.getElementById("form-add-phone").value; + var url = "http://localhost:11000/api/create"; + var payload = { + "name":name, + "phone":phone + } + sendHttpRequest(url, "POST", payload, function (error, response) { + if (error) console.error(`Error: ${error}`); + else table.ajax.reload(null, false); + }, "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); + }, "application/json"); + alert("Data berhasil dirubah"); +} + +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); + }, "application/json"); + alert("Data berhasil dihapus, permanent, selamanya!"); +}