I want to have a Repeater in a fixed position on the page, displaying only one, randomly selected item from a Collection. The Repeater is connected to a Dataset from which it pulls an image at random from the Collection, via this code:
import wixData from ‘wix-data’ ;
$w . onReady ( function () {
$w ( “#dataset1” ). onReady (() => {
wixData . query ( “homepage-sleeves” )
. find ()
. then (( result ) => {
const shuffledArray = shuffleArray ( result.items );
$w ( ‘#repeater1’ ). data = shuffledArray ;
})
. catch (( err ) => {
let errorMsg = err ;
});
});
});
function getRandomIndex ( min , max ) {
return Math . round ( Math . random () * ( max - min ) + min );
}
function shuffleArray ( dataArray ) {
**for** ( let i = dataArray.length - 1 ; i > 0 ; i --) {
let index = getRandomIndex ( 0 , i );
const temp = dataArray[i ];
dataArray[i ] = dataArray[index ];
dataArray[index ] = temp ;
}
**return** dataArray ;
}
In the Editor, it correctly displays one image, but when previewing the page, 5 images are displayed, one on top of the other down the page. This is how it displays in the editor:
“Number of items to display” is set to 1:
And this is how it displays when saved and published: https://www.beerswpeers.com/
Any ideas how I can stop it from displaying more than 1 image? Thanks!