diff --git a/Lab#1/FE/index.js b/Lab#1/FE/index.js index ba1ae86..bb68785 100644 --- a/Lab#1/FE/index.js +++ b/Lab#1/FE/index.js @@ -31,22 +31,70 @@ function fetchEmployees() { // TODO // add event listener to submit button +const submitbtn = document.getElementsByClassName("btn btn-primary mt-3")[0]; +submitbtn.addEventListener("click",createEmployee); // TODO // add event listener to delete button +// Attach event listener to table body +document.getElementById('dataTable').addEventListener('click', function(event) { + // Check if the clicked element is a delete button + if (event.target.classList.contains('btn-danger')) { + // Call deleteEmployee with the id of the clicked button's parent row + const id = event.target.parentElement.parentElement.firstChild.textContent; + deleteEmployee(id); + } +}); +const deletebtn = document.getElementsByClassName("btn btn-danger btn-sm"); +for ( let i = 0; i < deletebtn.length; i++) +{ + deletebtn[i].addEventListener("click", () => deleteEmployee(idCell.value)); +} // TODO function createEmployee (){ // get data from input field - // send data to BE - // call fetchEmployees + const namefield = document.getElementById("name"); + const idfield = document.getElementById("id"); + const newname = namefield.value; + const newid = idfield.value; + if (newname === '' || newid === '') + { + alert("empty fields"); + } + else + { + // send data to BE + fetch('http://localhost:3000/api/v1/employee' , { + method : 'POST', + headers : {'Content-Type': 'application/json',}, + body : JSON.stringify({newname,newid}),}); + // call fetchEmployees + if (response.ok) + { + fetchEmployees(); + } + else + { + alert("this employee already exists"); + } + } } // TODO -function deleteEmployee (){ +function deleteEmployee (id){ // get id + //const id = idCell.value; // send id to BE + const response = fetch(`http://localhost:3000/api/v1/employee/${encodeURIComponent(id)}`, { + method: 'DELETE', + headers: { + 'Content-Type': 'application/json', + }, + body: JSON.stringify({ id }), + }); // call fetchEmployees + fetchEmployees(); } fetchEmployees()