Custom Script funktioniert nicht auf Produkt Varianten Seite

Hallo,

ich habe mein Custom Script in der Theme.php eingebunden:
protected $javascript = [
        ‘src/js/custom.js’
    ];

Wenn ich auf eine Produktseite gehe funktioniert es initial auch erst. Wenn ich dann aber eine Varianten Option auswähle gelange ich auf die Produktseite der Variante und hier funktionieren meine Scripts nicht mehr. Erst wenn ich auf der Seite erneut einen refresh mache also F5 drücke, funktionieren die Scripts wieder.

Habe bereits versucht die Scripts mit diesem Code zu wrappen
document.asyncReady(function() {
    // do your magic here  
});

Leider funktioniert das nicht. Wie binde ich meine Scripts korrekt ein?
 

Hallo,

 

das Problem ist, dass beim Ajax Variantenwechsel eine komplette HTML Seite vom Server mittels Ajax geladen wird, die dann in das aktuelle document gemergt wird. Ist in meinen Augen völlig unnötig, macht aber Shopware so.

 

Dein Problem hat also was mit Late Binding zu tun. Da sämptliche ready Events bereits erreicht wurden, nützt es auch nichts, sich darauf zu binden. Du müsstest also direkt dein Skript ausführen, ohne es in ein $(document).ready oder ähnliches zu stecken.

Aber um das genauer sagen zu können, warum es in deinem Einzelfall nicht geht, müsste man den Code sehen. Poste doch mal den Code, dann kann man wesentlich besser helfen.

 

 

MFG

 

derwunner

Erst einmal Danke für die schnelle Antwort.
Jedoch habe ich die Scripts bereits so eingebunden:
 

$(function(){
 // code
});

 

Es sollte dann ja sofort ausgeführt werden oder nicht?.

Du willst deinen Code direkt nach dem Variantenwechsel ausführen. Ich denke in dem Fall wäre es das einfachste, wenn du dich auf das Event vom Ajax Variantenwechsel registrierst, also auf plugin/swAjaxVariant/onRequestData.

Referenz: shopware/jquery.ajax-variant.js at 5.4 · shopware/shopware · GitHub

Das reagiert allerdings nur, sobald der Benutzer einen Variantenwechsel durchführt. Du brauchst also noch den initialen Seitenaufruf. Das könntest du einfach in deiner Skript Datei machen, da das kompielierte JavaScript am Ende des HTML Dokuments eingebunden wird. Somit ist alles bereits da.

 

1 Like

Führe deinen Code einfach nochmal beim Ajax-Wechsel erneut aus:

$.subscribe('plugin/swAjaxVariant/onRequestData', function() {
    //call function again
}

 

1 Like

Ich danke euch Beiden für eure Hilfe! Es hat geklappt. Ich bekomme zwar zunächst beim initial Aufruf eines Artikels einen Type Error in der Konsole, dass er die Funktion $.subscribe nicht findet, aber nachdem ich eine Variante auswähle verschwindet der Error und es funktioniert.

Dann hast du wahrscheinlich asynchrones Javascript in den Theme-Einstellungen aktiv und dein js lädt synchron (bevor jQuery geladen wird). Du müsstest dein js wahrscheinlich einfach nur auch asynchron laden.