Stumped on creating a button to load a random item from a dynamic page/collection

Ask the community
, , ,
1

Question:
Hello everyone!

How do I create a button on a regular page that will either open a new page with an item from a dynamic page or simply list the information present on the collection where that dynamic page belongs?

Product:
Wix Editor

What are you trying to achieve:
My goal is to have a button on a regular page, that when someone presses it, it will either:
a) open a random item from a collection, alongsite the fields from it I want it to display
b) open a random dynamic page that already contains all the information.

What have you already tried:
I tried following this page from your forum, but somehow I’m getting stumped because if the button isn’t on the dynamic page itself, then it will have the red underline that the items are invalid.
If I create a dynamic page with the collection it instead lists all the items, and always starts on the first item, which defeats the purpose of having the random page loader.

Example of what I tried to create that has failed:

$w.onReady(function () {
    const collectionName = 'Stones';

    wixData.query(collectionName)
        .find()
        .then(results => {
            
            const randomIndex = Math.floor(Math.random() * results.items.length);

            //Get random Stone
            const randomStone = results.items[randomIndex];

            //Lists dynamic page items
            $w('#StoneName').text = randomStone.StoneName;
            $w('#StoneImage').src = randomStone.imageURL;
            $w('#StoneDigSite').text = randomStone.StoneDigSite;
        })
        .catch(err => {
            console.error(err);
        });
});

If it’s outside of the Dynamic Page, it fails to recognize the “StoneName”, “StoneImage” and “StoneDigSite” elements.
If it’s inside the dynamic page, then the button just… does nothing.

What exactly am I missing here?

Additional information:
The objective is not that users are unable to view all other items, it’s just that it loads a random page from that dynamic page/collection

2

To get a button to do something when clicked you’ll need an onClick event handler: onClick - Velo API Reference - Wix.com