Actualiser test.html

test.html

@@ -31,42 +31,44 @@
     </div>
 
     <script>
-        // 1. Simulation : Fonction qui "modifierait" le produit
+        // 1. Fonction qui affiche le formulaire
         function mockEditProduct(id) {
-            console.log("Tentative de modification pour l'ID : " + id);
+            const categories = ["Fruits", "Légumes", "Boissons", "Épicerie", "Surgelés"];
-            
+            let optionsHTML = categories.map(cat => `<option value="${cat}">${cat}</option>`).join('');
-            // On affiche un faux formulaire à la place de la modale
+
             const container = document.querySelector('.modal-preview');
             container.innerHTML = `
                 <h3>Modification du produit #${id}</h3>
-                <form onsubmit="event.preventDefault(); alert('Changement enregistré (simulation réussie !)'); location.reload();">
+                <form onsubmit="event.preventDefault(); alert('Catégorie ' + document.getElementById('cat-select').value + ' enregistrée !'); location.reload();">
-                    <label>Nouvelle catégorie :</label><br>
+                    <label>Choisir la catégorie :</label><br>
-                    <input type="text" value="Fruits" style="width:100%; padding:8px; margin: 10px 0;">
+                    <select id="cat-select" style="width:100%; padding:8px; margin: 10px 0;">
+                        ${optionsHTML}
+                    </select>
                     <br>
-                    <button type="submit" class="btn btn-success">Enregistrer les modifications</button>
+                    <button type="submit" class="btn btn-success">Enregistrer</button>
                     <button type="button" class="btn btn-danger" onclick="location.reload()">Annuler</button>
                 </form>
             `;
         }
-    
+
-        // 2. Injection du bouton bleu qui appelle notre simulateur
+        // 2. Injecteur qui ajoute le bouton bleu
-        function injectShortcut() {
+        setInterval(() => {
             const greenBtn = document.querySelector('.btn-success');
             if (greenBtn && !document.querySelector('.btn-catalog-shortcut')) {
                 const container = greenBtn.parentNode;
                 let pId = greenBtn.getAttribute('data-id');
                 
                 const blueBtn = document.createElement('button');
+                blueBtn.type = 'button';
                 blueBtn.className = 'btn btn-catalog-shortcut';
-                blueBtn.style.cssText = 'background-color: #1976d2; color: white;';
                 blueBtn.innerText = '✏️ Modifier la fiche';
                 
+                // Au clic, on appelle notre fonction de test
                 blueBtn.onclick = () => mockEditProduct(pId);
+                
                 container.insertBefore(blueBtn, greenBtn);
             }
-        }
+        }, 500);
-    
-        setInterval(injectShortcut, 500);
     </script>
 </body>
 </html>