JS

listeIngr.js

@@ -1,12 +1,4 @@
 document.addEventListener("DOMContentLoaded", function(){
-    
-    function modifier_button_ingr(element){
-
-        let modif = element.parentElement.previousSibling.previousSibling;
-        //modif.style.color = "red";
-        console.log("click")
-    }
-
 
 
     let modifier_button = document.getElementsByClassName("ingr-modifier");
@@ -14,7 +6,43 @@ document.addEventListener("DOMContentLoaded", function(){
     console.log(modifier_button);
 
     for (const element of modifier_button) {
-        element.addEventListener('click', modifier_button_ingr(element));
+        element.addEventListener('click', function () {
+            let modif = element.parentElement.previousSibling.previousSibling;
+
+            let data = element.getAttribute("data-id");
+            
+            let form = document.createElement("form");
+
+            form.setAttribute("method", "POST");
+            form.setAttribute("action", "/ingredient/edit/" + data);
+            form.setAttribute("class","liste-ingr-elem-text")
+
+            let input = document.createElement("input");
+
+            input.setAttribute("type", "text");
+            input.setAttribute("class", "form-control");
+            input.setAttribute("name","modif_ingr");
+            input.setAttribute("placeholder", "modificiation");
+
+            let hidden = document.createElement("input");
+
+            hidden.setAttribute("type","hidden");
+            hidden.setAttribute("name","id");
+            hidden.setAttribute("value", data);
+
+            let button = document.createElement("button");
+
+            button.setAttribute("type", "submit");
+            button.setAttribute("class", "btn btn-primary");
+            button.innerText = "Submit Modification";
+
+            form.append(input)
+            form.append(hidden)
+            form.append(button)
+
+            modif.replaceWith(form);
+
+        });
     };
 
 });