Elementor Popup triggered via code closes immediately

user_11808300 0
Viewed 1677

just wondering if anyone has had this issue and if they resolved it?

I'm trying to trigger a popup when the following selector has been clicked "label[for='form-field-lampshade_shape']" (is a form label). The popup appears for a split second and closes

I've tried doing this via JS and the "Open by Selector" option in the popups advanced settings, both have the same result; The popup literally just appears as a flicker.

JS

jQuery("label[for='form-field-lampshade_shape']").click(function() {
    elementorProFrontend.modules.popup.showPopup( { id: 24601 } );
});

Open by Selector enter image description here

elementor wordpress javascript
1 Answers

It seems to be a label specific issue. When you click on a label of a input field, the blinking cursor jumps by default into the related input field, textarea or i.e. checks a checkbox. When I hover over a Elementor input label my cursor changes from arrow to hand, so there is already a click event listener bind to the label.

One solution is adding e.preventDefault() and the e in function( e ):

jQuery( 'label[for="form-field-lampshade_shape"]' ).click( function( e ) {
    e.preventDefault();
    elementorProFrontend.modules.popup.showPopup( { id: 24601 } );
});

Or you enter at the popup's "Open By Selector" for example input[name="form-field-lampshade_shape"] in the assumption this is the correct input field. Now the popup opens when clicking on the label or in the input field.

user_80009790
Related