Developer forum

Forum » CMS - Standard features » JS event for loaded Related Products

JS event for loaded Related Products

Mafalda Correa Dynamicweb Employee
Mafalda Correa
Reply

Hi,

I'm trying to run some code once the slider for the related products is loaded, but there doesn't seem to be any event dispatched then.

I tried using "update.swift.productlist", but that event is dispatched before the slider fully loads. In the documentation, a "updated.swift.productlist" event is mentioned, but I don't see any reference to it in the code and when I try to add an event listener to that event, nothing fires.

Here's a quick repro of what I'm trying: https://www.screencast.com/t/eM2I8lgeCdI

I've looked at the sliders.js code and it doesn't seem like any event is being dispatched then either. So am I doing something wrong or do we not have a custom event for this? Would that be something we could add?

Thank you


Replies

 
Nicolai Pedersen Dynamicweb Employee
Nicolai Pedersen
Reply

You can use a mutation observer: https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver

Something like this:

var observer = new MutationObserver(function(mutations, observer) {
    console.log(mutations, observer);
});

observer.observe(document.getElementById("RelatedProducts_4251"), {subtree: true,attributes: false});

BR Nicolai

 
Mafalda Correa Dynamicweb Employee
Mafalda Correa
Reply

Thanks Nicolai. I already had a solution in place, but that one is much more elegant.

Still, I believe it would be more straight forward if we could have a custom event that is fired when the slider is loaded, same way we had with Rapido, but this will work for the time being.

Thanks

 
Nicolai Pedersen Dynamicweb Employee
Nicolai Pedersen
Reply

Yeah.

Be aware that tinyslider which we use now on Swift will be replaced pretty soon (for new installations only 1.1 or 1.2). Tiny slider has a number of issues and is too slow and we are getting new and more modern options in css/html that we will use instead (using scroll-snap-align and similar). 

BR Nicolai

 
Nicolai Pedersen Dynamicweb Employee
Nicolai Pedersen
Reply

What code are you running when the slider loads if I may ask? Trying to understand to see if it could be something interesting for Swift.

Thanks, Nicolai

 
Mafalda Correa Dynamicweb Employee
Mafalda Correa
Reply

Not sure if you're asking which code I'm running to see if the slider has loaded or what code I'm running when the slider loads.

Before you showed me the MutationObserver, I simply had a setInterval checking whether the js-slider was null or not before running my code.

As for the code I'm running, I'm implementing live product info, so I need to know when the slider has loaded so that I can replace the prices with the ones coming from live integration.

Does that answer your question?

 
Nicolai Pedersen Dynamicweb Employee
Nicolai Pedersen
Reply

Yes - it does.

And also on our future to-do - loading prices from live async.

 
Mafalda Correa Dynamicweb Employee
Mafalda Correa
Reply

We need live product info for our project which will start in November. If it comes from Swift 1.1 then, great, we'll implement Swift's. Either way, we've developed our own version for now.

 

You must be logged in to post in the forum