Pagination bar delayed update

Ask the community
,
1

My fellow Website Developers,

My issue is regarding resetting the pagination bar for the repeater after it has been filtered. I would like to know if I am connecting to the repeater inappropriately, or if additional coding is incorrect.

Background: My repeater connects to a collection rather than a dataset. (Attempts to connect to a dataset resulted in a load error.) Connecting to the collection, I filter the collection depending on the data selected by a number of filters. The information correctly displays for the first few items selected.

California: 3 DJs
Ohio: 5 DJs
(i.e. My repeater displays 6 at a time. I have a total of 8 DJs in the collection, but only 3 from California. If I search for DJs in California, I get the result of 3. However, at the bottom there is a pagination bar and it displays 2 pages. As the result is less than 6, my new pagination bar should display only 1. )

My testing has shown that the pagination bar updates, but only after I search again. I have done console logs for the repeater length.

        console.log("This is the number of values in the repeater from VendorCode: " + $w('#repeater1').data.length.toString());

The results that I get is:
At page load there is no filtering so result = 8.
Filter by California result= 8
Filter by Ohio result= 3
Filter by Texas result= 5
Filter by California result= 0

I want to make clear again that the page displays the proper filter in the repeater, but my problem is that the pagination bar is not updating. Worse is that if Ohio or California is selected, the pagination bar always has a page 2. Below is how the filter is called to update:

    $w('#stateLocationDropdown').onChange((event) => { 
        session.setItem("location",$w('#stateLocationDropdown').value);
        let newStateLocation=$w('#stateLocationDropdown').value;
        displayServicesInRepeaterWithLocation("Entertainment",newStateLocation);    
        
        let totalPages = $w('#repeater1').data.length/6;
        $w("#paginationEntertainment").totalPages = parseInt(totalPages.toString())+1;
    });

Here is how the collection is updated:

export function displayServicesInRepeaterWithLocation(webpageName,location){

    filterCheck(webpageName);

    let selectionTopListings = $w('#topListingsCheckboxGroup').value;
    let selectionCategories = $w('#categoriesCheckboxGroup').value;
    let selectionStartingPrices = $w('#startingPricesCheckboxGroup').value;
    let selectionMusicGenre = $w('#musicGenreCheckboxGroup').value;

    let dataQuery = wixData.query(membersDatabaseName);
    
if((location.length > 0) && (webpageName == "Entertainment")){
        $w('#StateLocationSearchButton').hide();
        dataQuery = dataQuery.contains('state', location).and(dataQuery.hasSome("vendorType", selectionCategories)).and(dataQuery.hasSome("subscriptionLevel", selectionTopListings)).and(dataQuery.hasSome("tempStartingPrice", selectionStartingPrices)).and(dataQuery.hasSome("musicGenre", selectionMusicGenre).eq("Services","Entertainment"));
        
        dataQuery
            .find()
            .then(results => {
                    const filtereditemsReady = results.items;
                    
                    //REPLACE repeaterID WITH REPEATER'S ID ON PAGE
                    $w('#repeater1').data = filtereditemsReady;
                    
            }).catch( (err) => {
        let errorMsg = err;
        console.error(errorMsg);
    } );
} 

    $w("#dynamicDataset").onReady( () => {
        console.log("This is the number of values in the repeater from VendorCode: " + $w('#repeater1').data.length.toString());
    });
}

If there is any advice that can help me correctly place the timing of the pagination bar to refresh it’s value that would be excellent.

2

I managed to resolve this. The counter that I used for the pagination was put into the dataquery, and this provided me with the proper value and not a delayed result.

dataQuery.find().then(results => {
	const filtereditemsReady = results.items;
	let totalPages = results.length/6;
					
	//REPLACE repeaterID WITH REPEATER'S ID ON PAGE
	$w('#repeater1').data = filtereditemsReady;	
					
	//SETS NUMBER OF PAGES TO BE DISPLAYED
	$w("#paginationEntertainment").totalPages = parseInt(totalPages.toString())+1;
});