document.addEventListener("DOMContentLoaded", function() { // Funktion zum Aktualisieren der Verfügbarkeit function updateCustomAvailability() { const inputProduct = document.querySelector("input.product_id"); if (!inputProduct) { console.log("Kein product_id Input gefunden."); return; } const productId = inputProduct.value; console.log("Gefundene Produkt-ID im input:", productId); // Suche den Container mit der Verfügbarkeitsnachricht, z.B. per Klasse oder data-Attribut // Beispiel: div.availability_message_ const availabilityContainer = document.querySelector(`.availability_message_${productId}`); if (!availabilityContainer) { console.log("Kein Verfügbarkeitscontainer für Produkt-ID", productId, "gefunden."); return; } const availabilityText = availabilityContainer.textContent.trim().toLowerCase(); console.log("Gefundene Verfügbarkeitsnachricht:", availabilityText); // Prüfe, ob das Produkt auf Lager ist let inStock = false; if (availabilityText.includes("verfügbar") || availabilityText.includes("auf lager")) { inStock = true; } // Beispiel: Erstelle oder aktualisiere ein Custom Status-Div let statusDiv = document.getElementById("custom_availability_status"); if (!statusDiv) { statusDiv = document.createElement("div"); statusDiv.id = "custom_availability_status"; statusDiv.style.marginTop = "10px"; statusDiv.style.fontWeight = "bold"; statusDiv.style.color = inStock ? "green" : "red"; inputProduct.parentNode.appendChild(statusDiv); } statusDiv.textContent = inStock ? "Auf Lager" : "Nicht auf Lager"; statusDiv.style.color = inStock ? "green" : "red"; } // Initiales Update updateCustomAvailability(); // MutationObserver oder EventListener, falls sich die Produkt-ID ändert (z.B. bei Variantenwechsel) const inputProduct = document.querySelector("input.product_id"); if (inputProduct) { const observer = new MutationObserver(() => { updateCustomAvailability(); }); observer.observe(inputProduct, { attributes: true, attributeFilter: ["value"] }); } });