$.modal.open ..will nicht

Shopware 5 Programmierung
1

Hallo zusammen,

der simple Aufruf des Shopware Modals in jquery in ready will bei mir nicht auslösen… 

jQuery(document).ready(function($){
            $.modal.open('Hello World', {
              title: 'My title'
            });

});

eine Verlagerung in meine jquery load funktionert stattdessen problemfrei.

jQuery(window).load(function () {

});

hätte irgendwer vielleicht einen Tipp für mich? Vielen Dank!

VG, Stefan

2

Was gibt die Konsole für einen Fehler aus?

viele Grüße 

3

keinen einzigen! Das Modal wird einfach ignoriert in der Ausführung. 

In der folgenden Funktion wird das alert() nicht erreicht, steht es vor dem $.modal.open wird das alert ausgeführt. Das Modal jedoch in keinem Fall. 

jQuery(document).ready(function($){

        $('.modal_open').click(function (event) {
            event.preventDefault();
            modal();
        });
        
        function modal(){
                
            $.modal.open('Hello World', {
              title: 'My title'
            });
            alert('test');
        }

});

 

4

Hey @ghostdog‍,

klingt sehr nach einen Problem mit der Reihenfolge wie du Javascript-Dateien lädst. Hier einmal die Erklärungen.

window.load:
„The load event fires at the end of the document loading process. At this point, all of the objects in the document are in the DOM, and all the images and sub-frames have finished loading.“

$(document).ready():
„While JavaScript provides the load event for executing code when a page is rendered, this event does not get triggered until all assets such as images have been completely received. In most cases, the script can be run as soon as the DOM hierarchy has been fully constructed. The handler passed to .ready() is guaranteed to be executed after the DOM is ready, so this is usually the best place to attach all other event handlers and run other jQuery code. When using scripts that rely on the value of CSS style properties, it’s important to reference external stylesheets or embed style elements before referencing the scripts.“

Sprich der Unterschied ist dass bei „window.load“ alle Assets (Bilder, Javascript, Styles usw.) geladen sind bevor das Event gefeuert wird. „$(document).ready“ wird aufgerufen, wenn die DOM-Struktur komplett geladen ist. Deshalb der Hinweis, dass deine Hierarchie nicht korrekt ist.

Viele Grüße,
Stephan Pohl  Shopware