Hi, I’ve been struggling on this topic, I’ve done a lot of researching in / outside the forum, still being stuck on this.
Basically I’ve applied a filter feature by referring at Wix Velo Template - Mega Search template (https://www.wix.com/velo/example/mega-search).
(Of course with some modification to fit my needs, but the structure basically is the same, and it works perfectly.)
The filter bar:
To make the website’s performance faster and better, I limit a certain number of data to show during the initial page loading as well as initial filtering.
So I was thinking to put a “Load more” button if customer decide to want to view more data (In my case it is vehicle.).
Problem:
I did a simple “LoadMore” onClick function, it kinda works, it does show more but it doesn’t apply the filter, which means it pull everything in the Dataset:
The simple “LoadMore” onClick function code:
export function LoadmoreButton_click ( event ) {
$w ( ‘#CarListDataset’ ). loadMore ()
. then (() => {
console . log ( “Done loading more data” )
});
}
What I need:
I need it to show more but remain the filter or any pre-registered filter so it doesn’t show any random not related (Or something that I hide like the following sample of no-picture-option) vehicle during the click on show more.
Example:
I just want to find SUV vehicle, so I go to the filter tab and choose SUV:
It will shows 5 of the SUV type of vehicle (I limit it on 5, as example). All the vehicle are SUV, the filter works well:
Now when I click on the load more, it does show more, but the filter doesn’t works anymore, as you can see there are all type of vehicle (such as Sedan, two seater Coupe, MPV, SUV, etc… even those without photo shouldn’t have show up as I set a isNotEmpty ( “image” )" in the code.):
I’ve no idea where and how to solve it, any tips and helps will be much appreciate. Thank you so much! 