• You MUST read the Babiato Rules before making your first post otherwise you may get permanent warning points or a permanent Ban.

    Our resources on Babiato Forum are CLEAN and SAFE. So you can use them for development and testing purposes. If your are on Windows and have an antivirus that alerts you about a possible infection: Know it's a false positive because all scripts are double checked by our experts. We advise you to add Babiato to trusted sites/sources or disable your antivirus momentarily while downloading a resource. "Enjoy your presence on Babiato"

Any Elementor or JS expert for advise

xantor

Member
Jan 4, 2021
86
82
18
Here is the problem, I have a page with a side panel that is built using Elementor popups. On the page there the user clicks a button to show the side panel, the content shown must be decided the moment the side panel opens. i.e.: Let's say I have a select where the user can choose any of 5 options, when the button is clicked to open the side panel, it must show one of 5 Elementor templates based on the user's selection on the main page. Since I am using Elementor I find that Elementor renders everything, including the popup when it loads, thus making the user selection irrelevant, always showing the content for the default selection that was active when the page loads. These are the options I have available at the moment:

1. Delay the popup rendering to occur when the user clicks the open side panel button. So far I don't believe this is possible with Elementor. Besides this solution creates another problem, if the user closes the popup and opens it again after changing the selection it will always show the popup for the first selection when it opened the first time.
2. Render the popup every time this would be a very viable solution, it would work every time the user changes the selection. The problem is that I can't seem to find how to do it unless I find a way to get the widgets instance from Elementor and then call the render function before showing the popup (I know Render is a protected method, but I can work around it)
3. Using JS, the problem is that the selection is in the server side and JS works on the client side. I am a not so good writing JS (just the basics) so I don't know how I would do it.

I am open to suggestions and alternate solutions that anyone here can offer.

Thanks in advance for your input.
 
Do you mean that the sidebar would appear the moment a user selects one of the five options? If that's the case it's easy: just hide all panels and show the corresponding panel when the user makes a selection.

Also, if I remember correctly, in Elementor you can setup a popup to show only when a user clicks on a button with a certain class (or id).
 
AdBlock Detected

We get it, advertisements are annoying!

However in order to keep our huge array of resources free of charge we need to generate income from ads so to use the site you will need to turn off your adblocker.

If you'd like to have an ad free experience you can become a Babiato Lover by donating as little as $5 per month. Click on the Donate menu tab for more info.

I've Disabled AdBlock