Update custom widget while having a js script

[mtumbarello-eness]

Start a discussion

Hi,

I'm currently adding js to my custom widget, I also made it working in the editor but it seems that each time I change any control value of the widget in the editor, the whole script will be reloaded.

First of all I did that (as Elementor advised to do) :

• I registered the script with 'elementor-frontend' to make it available in the editor

wp_register_script('Realisation-js', plugins_url('assets/js/elementor-realisation.js', __FILE__), [ 'elementor-frontend' ], '1.0.0', true );

• I extended this class in my js script :

class RealisationHandler extends elementorModules.frontend.handlers.Base

• and added the handler

$(window).on( 'elementor/frontend/init', () => {
        const addHandler = ($element) => {
            elementorFrontend.elementsHandler.addHandler(RealisationHandler, {
                $element, 
            });
        };
        elementorFrontend.hooks.addAction( 'frontend/element_ready/realisation.default', addHandler );
} );

This is my onElementChange function, which is working. The problem isn't there, but this is what I want to use to trigger my functions according to the control value I'm modifying :

onElementChange(propertyName) {
            if (this.getSettingsValues().settings.hasOwnProperty(propertyName)) {
                this.updateWidgetContent();
            }
}

And this is my onInit function :

onInit() {
            this.elements = this.getDefaultElements();
            this.postdata = this.getPostdata();
            this.settingsValues = this.getSettingsValues();
            
            if (this.postdata.$postsPerPage > this.postdata.$postsTotal) this.postdata.$postsPerPage = this.postdata.$postsTotal;
            
            this.updateWidgetContent();
}

I don't get why each time I change any control value, the onInit() is executed as if an new object spawned instead of keeping the already existant one ? Am I missing something or did I make anything wrong ?

Would appreciate help, I can't find anything on the Elementor Doc speaking about this