How to limit repeater in mobile version without using database

Ask the community
,
1 
Hello, I'm having trouble limiting the number of items in a repeater through code without using the database

For example, I would like the desktop version to show 5 items from the repeater, but on mobile, only the first 2 items from the repeater would appear without having to filter through the database

The Code to define in the mobile version I got, as shown below

But I haven't figured out how to limit the repeater on using the database

import wixWindow from ‘wix-window’;

$w.onReady(function () {
if(wixWindow.formFactor === “Mobile”){

  //[Code to limit the repeater?]
    
}

}
);

2

Is the repeater hooked up to a query via velo or are you using the database configurations (connect to data icon inside the editor)? Either way the approach is similar. You would get the data as a variable and use the slice method to display the number you’d like.

An example if you have the repeater hooked up to the content manager would be this:

import wixData from ‘wix-data’ ;
import wixWindow from ‘wix-window’ ;

let masterData
let newData

$w . onReady ( function () {

$w ( '#dataset' ). onReady ( **async**  () => { 
    **await**  getData () 
    console . log ( 'master data' ,  masterData ) 
    
    // form factor  
    **if**  ( wixWindow . formFactor  ===  'Mobile' ) { 
        $w ( '#testRepeater' ). data  =  newData . slice ( 0 ,  1 )  //first two items in repeater 
    }  **else**  { 
        $w ( '#testRepeater' ). data  =  newData . slice ( 0 ,  3 )  //first 4 items in repeater 
    } 
})

});

function getData ( ) {
$w ( ‘#testRepeater’ ). onItemReady (( $item , itemData , index ) => {
masterData = $w ( ‘#testRepeater’ ). data
//filter data you would like here
newData = masterData // new data = (whatever filter you are looking for)
})
}

3

So actually the repeater was configured manually in the editor without using the dataset

I tried to change the code to leave without the dataset, but I couldn’t connect, could you help me?

4

Gotcha, so if there’s no data configurations, slice() should still do the job. Try this and change the “testRepeater” name below to your repeater’s name.

import wixWindow from ‘wix-window’ ;

$w . onReady ( function () {

**let**  data  =  $w ( '#testRepeater' ). data 
console . log ( data ,  'data' ) 

**if**  ( wixWindow . formFactor  ===  'Mobile' ) { 
    **let**  newData  =  data . slice ( 0 , 1 )  //2 items 
    $w ( '#testRepeater' ). data  =  newData 
}  **else**  { 
    **let**  newData  =  data . slice ( 0 , 4 )  // 5 items 
    $w ( '#testRepeater' ). data  =  newData 
}

});

5

Thanks a lot, it worked!