Help creating next and previous buttons for favourites list

Ask the community
, ,
1

I have created a favourites collection (called “myWorkOut”) which contains items picked from a main collection (called “Exercises”). I have used this “Wishlist” tutorial https://support.wix.com/en/article/velo-tutorial-adding-a-wishlist-to-a-wix-stores-site
I want to add “Next” and “Previous” buttons on the dynamic “Item” page when viewing items from a repeater that is connected to the “myWorkOut” collection. This repeater is on a regular page called “My Workout”. I have used this tutorial as the starting point “Velo Tutorial: Creating Previous and Next Buttons for a Dynamic Item Page with Code”

The code added to the “My Workout” page is intended to create a map of the dynamic page URLs of the items in the “myWorkOut” collection (stored in a Page Link field) and then capture that in local storage, so that it is available when moving to the Item page from the “My Workout” page. I think I understand all that correctly.

This is the code on the “My Workout” page - which is copied from the tutorial, with two console logs for diagnostics

const linkField = “link-exercises-title”
$w( “#dataset1” ).onReady(() => {
const numberOfItems = $w( “#dataset1” ).getTotalCount();
console.log( "number of items = " +numberOfItems)
$w( “#dataset1” ).getItems( 0 , numberOfItems)
.then( (result) => {
const dynamicPageURLs = result.items.map(item => item[linkField]);
console.log(dynamicPageURLs)
local.setItem( ‘dynamicPageURLs’ , dynamicPageURLs);
} )
. catch ( (err) => {
console.log(err.code, err.message);
} );
});

It is evident from the console logs that the code is correctly identifying the number of items in the collection, but it is returning “Undefined” instead of each dynamic page URL

I think the problem is that the “linkField” is not held in the “myWorkOut” collection itself - instead it is accessed via a Reference field which refers back to the original “Exercises” collection. And I think I need some extra code in the following line, to reflect that

const dynamicPageURLs = result.items.map(item => item[linkField]);

However, I have searched everywhere (and also tried a WixData query instead) but I can not find out how to refer to a Page Link field that is accessed via a Reference field.

I hope you can help. This is my first post - please go easy on me…

2

Well - I have worked it out (if anyone is listening…). I hope it helps someone else. The answer is to refer to the “exercise” reference field as follows:

const dynamicPageURLs = result.items.map(item => item.exercise[linkField]);