update function edit and delete product

asserts/js/index.js

@@ -1,3 +1,5 @@
+let isLoading = true;
+
 const includeHTML = () => {
   let z, i, elmnt, file, xhttp;
   /*loop through a collection of all HTML elements:*/
@@ -28,4 +30,6 @@ const includeHTML = () => {
       return;
     }
   }
+
+  isLoading = false;
 };

asserts/js/main/product.js

@@ -1,8 +1,12 @@
+const getProducts = () => {
+  return JSON.parse(localStorage.getItem("products")) || [];
+};
+
 /**
  * Show product
  */
 const showProduct = () => {
-  const products = JSON.parse(localStorage.getItem("products")) || [];
+  const products = getProducts();
   let productShow = "";
   products.forEach((product, index) => {
     productShow += `
@@ -11,8 +15,8 @@ const showProduct = () => {
         <td>${product.name}</td>
         <td>${product.price}</td>
         <td>
-          <button>Sửa</button>
-          <button>Xóa</button>
+          <button onclick="editProduct(${index})">Sửa</button>
+          <button onclick="delProduct(${index})">Xóa</button>
         </td>
       </tr>
     `;
@@ -24,7 +28,7 @@ const showProduct = () => {
 const addProduct = () => {
   const productName = document.getElementById("product-name").value;
   const productPrice = document.getElementById("price").value;
-  const products = JSON.parse(localStorage.getItem("products")) || [];
+  const products = getProducts();
   const product = {
     name: productName,
     price: productPrice,
@@ -33,3 +37,19 @@ const addProduct = () => {
   localStorage.setItem("products", JSON.stringify(products));
   showProduct();
 };
+
+const editProduct = (index) => {
+  const products = getProducts();
+  if (products.length === 0) return;
+
+  const product = products[index];
+  document.getElementById("product-name").value = product.name;
+  document.getElementById("price").value = product.price;
+};
+
+const delProduct = (index) => {
+  const products = getProducts();
+  products.splice(index, 1);
+  localStorage.setItem("products", JSON.stringify(products));
+  showProduct();
+};

index.html

@@ -14,7 +14,12 @@
     <main w3-include-html="./pages/main/index.html"></main>
     <script>
       includeHTML();
-      showProduct();
+      const interval = setInterval(() => {
+        if (!isLoading) {
+          clearInterval(interval);
+          showProduct();
+        }
+      }, 1);
     </script>
   </body>
 </html>