Eigenes Javascript funktioniert nach dem Laden per Ajax auf Detailseite nicht mehr

Hallo,
leider bin ich in Javascript/ jQuery noch nicht so gut. Habe meine Detailseite praktisch fertig. Vorher habe ich bei Klick auf eine Farbe die Seite neu laden lassen. Nachdem ich jetzt umgestellt habe auf Laden per Ajax, funktioniert mein Javascript nicht mehr.

Es ist eine ganz einfache Sache: Der Kunde wählt eine Farbe und alle Größen des Artikels werden in einer Tabelle ausgegeben. Nun kann er in die einzelnen Eingabefelder die Menge eingeben. Wird die Gesamtmenge vom Lagerbestand überschritten, färbt sich das Eingabefeld rot und der Button In den Warenkorb bleibt nicht anklickbar. Hier mal mein Script:

$('.menge').keyup(function () {
    var qty = 0;
    var ok = true;
    $(".menge").each(function (i) {
        if (!$(this).prop("disabled")) {
            $(this).removeAttr('style'); //Fehler Umrandung zurücksetzten
        }
        temp = parseInt($(this).val());
        temp1 = parseInt($(".mengemax" + i).val());
        if (temp > 0) {
            if (temp > temp1) {
                $(this).css("border", "2px solid red"); //Fehler Umrandung
                //$(this).css("background", "red");
                ok = false;
                $(".buybox--button,.column--quantity-link").prop({
                    disabled: true
                });
            }
        }
    });

    if (ok == true) { //die Eingabe ist in Ordnung
        $(".menge").each(function () {
            if ($(this).val() > 0) {
                qty = 1;
            }
        })
    }
    if (qty == 1) {
        $(".buybox--button,.column--quantity-link").prop({
            disabled: false
        });
    } else {
        $(".buybox--button,.column--quantity-link").prop({
            disabled: true
        });
    }
});

Kann mir bitte jemand auf die Sprünge helfen, wie ich es auch zum laufen bringe, wenn die Detailseite per Ajax (Javascript) nachgeladen wird?

Vielen Dank schon mal.

Gruß HEPI

Wo hast du umgestellt auf “Laden per Ajax”? Auf der Detailseite? Wo kann man denn da was umstellen, wäre mir neu.

Ansonsten musst du dich sicherlich an ein Event des Shopware jQuery Pluginshängen, sodass dein Script nach der Plugin Aktion ausgeführt wird.

Wie ist die URL zu deinen Shop?

Mhhh, fange mal den Ajax-Nachlade-event ab und initiere dein Skript dann immer neu.Wer weiss was der Eventlistener hier vergeigt? Am besten auch immer console.log(event) ausgeben. Ich teste auch ganze Funktionen in der Console.

@christiantrade‍ z.B. in der config_variant in der Zeile

{if $theme.ajaxVariantSwitch}data-ajax-select-variants="true"{else}data-auto-submit="true"{/if}

 {if $theme.ajaxVariantSwitch **x** }data-ajax-... schreiben. Dann wird nicht mehr per Ajax nachgeladen.

@brettvormkopp‍ Habe es jetzt zumindest schon mal so weit, dass mir ein Alert ausgegeben wird, wenn ins Textfeld geschrieben wird  Grin

Wird noch ein hartes Stück arbeit … und das beim letzten Test, bevor ich damit online gehen wollte …

@HEPI‍

Dann würde ich mich wie gesagt mal an ein Event vom Plugin hängen, welches dein Script nachdem nachladen aufruft.

Das jQuery Plugin ist dieses -> shopware/jquery.ajax-variant.js at 5.5 · shopware/shopware · GitHub

Laut Plugin am besten an dieses Event hängen -> shopware/jquery.ajax-variant.js at 5.5 · shopware/shopware · GitHub

Wie man sich an das Event hängt, habe ich bereits oben gepostet. Also wäre es pirnzipiell:

$.subscribe('plugin/swAjaxVariant/onRequestData', function() {
    deineFunction();
})

Damit wird deine Funktion aufgerufen, nachdem der Content via Ajax nachgeladen worden ist.

1 „Gefällt mir“

Danke. Habe es jetzt fertig. Muss nur noch Kleinigkeiten im CSS korrigieren, dann geht die neue Version online  Wearing-Sunglasses

@christiantrade‍ 

Ist jetzt fertig. Der Link zum Shop ist: www.shirt-guenstig-kaufen.de