How to get separate html widgets working on dynamic pages

  dynamic-pages, javascript, velo, widget, wix

I’m building a cryptocurrency website (don’t judge) on Wix, and am creating hundreds of dynamic pages to highlight each currency. What I need also is to have a html widget from TradingView on each page showing the trading chart of each crypto. For example on the Bitcoin dynamic page, have the BTC trading chart widget, on the Ethereum page, have the ETH chart displayed etc. The widget is linked here: https://uk.tradingview.com/widget/advanced-chart/

Now, just for reference, I’m not sure if Wix builds Dynamic pages like everywhere else, as I’m new to coding (hence using a web builder), but it works with Javscript, and when a dynamic dataset is created on a Wix page it’s iD is #dynamicDataset, and the html widget box iD is #html1.

The closest help on the internet I’ve found to this is via this link: https://www.wix.com/velo/forum/community-discussion/solution-html-iframes-connected-to-a-dataset-on-a-dynamic-page

However, after following all of the steps to a tee, I’m getting this error message when I publish the site Wix code SDK error: The url parameter that is passed to the src method cannot be set to the value . It must be of type url.

This is my code:

    $w.onReady(function () {
 >to load the page before running the code
    $w("#dynamicDataset").onReady(function () { 
    >to load the dynamic dataset's data before running the following code
        $w("#html1").scrolling = "no"; 
                 >so that scroll bars, if any, do not appear on our page. 
                         >if you want you can keep them!
        let widget = $w('#dynamicDataset').getCurrentItem().widgetURL; 
                 >we create a variable called "widget" and set its value to the URL we have  
                         >put in our data collection.
        $w("#html1").src = widget; 
                 >we set the dynamic page's HTML element's URL value to that of "widget", 
                         >which is actually the URL from our data collection.
    })
});

I would massively appreciate any help on this, and have a feeling this code is almost correct? If anyone could point me in the right direction, I’d be forever grateful. I’ve searched for 3 days now and no luck.

Source: Ask Javascript Questions

LEAVE A COMMENT