Important forum update

This forum is migrating to one unified Wix community forum starting July 26th, and will be read-only during the process.

Members

To see this working, head to your live site.

Neff Design

Jun 18, 2020

Edited: Jun 18, 2020

Why does hasNextPage() always return true?

in Coding with Velo

I’ve seen serval older posts with the opposite of this problem (always false), but I can’t figure it out.

I have a dataset with 4 records and the repeater is set to limit to 2 records per page.

On data ready I call getTotalPageCount()and it outputs 2 pages, as expected. I can also call hasNextPage() and it returns true, again as expected.

This is where things turn weird:

I have a transparent strip below the fold of my page and set the onViewortEnter to call loadMore() which works as expected (the first time). THEN I run a check to see if there are more pages to follow (hasNextPage()), if no, collapse the strip so it will quit calling. hasNextPage() always returns true! I started logging the total number of pages and the current page index with every call. The total number of pages stays at 2 (which is correct), but the page index keeps incrementing every time the loadMore() runs.

I’m sure this is a timing/callback issue, but I’ve tried everything. What am I missing/not understanding?

export function stripNextPage_viewportEnter(event) {

console.log($w("#dbProperties").getTotalPageCount()); // 2

console.log($w("#dbProperties").getCurrentPageIndex()); // Increments on each call

$w("#dbProperties").onReady(() => {

$w("#dbProperties").loadMore()

.then(() => {

console.log("Done loading more data");

$w.onReady(() => {

$w("#dbProperties").onReady(() => {

let hasNextPage = $w("#dbProperties").hasNextPage();

console.log(hasNextPage); // always returns true

//If no more pages exist collapse strip

if (!hasNextPage) {

$w("#stripNextPage").collapse();

}

});

}

3 answers5 replies

8 Comments

mosguinz

Jan 08, 2022

Can confirm this issue still exists. I have the same use case as well.

I've tried adding a three-second timeout, but to no avail. hasNextPage() seem to always return true.

Upon further inspection, it seems that the loadMore() will work no matter what (probably due to the fact that hasNextPage() always returns true).

Here's an example of the logs. My dataset loads two items at a time. There's 12 items in total, so there should be six pages.

I have a recursive function that keeps loading as long as hasNextPage() is true. The getTotalPageCount() seems to work fine here.

pageIdx 1 // totalPages 6
hasNextPage true totalsize 12
pageIdx 2 // totalPages 6
hasNextPage true totalsize 12
pageIdx 3 // totalPages 6
hasNextPage true totalsize 12

However, once it reaches page six, where hasNextPage() should return false and the recursion stops, it keeps going.

Note that loadMore() continues to "work" without throwing an error, and the getCurrentPageIndex() is incremented beyond the page count returned by getTotalPageCount().

pageIdx 6 // totalPages 6
hasNextPage true totalsize 12
pageIdx 7 // totalPages 6
hasNextPage true totalsize 12
pageIdx 8 // totalPages 6
hasNextPage true totalsize 12
pageIdx 9 // totalPages 6
hasNextPage true totalsize 12

mosguinz

Jan 08, 2022

Replying to

Workaround

Since we can rely on getCurrentPageIndex() and getTotalPageCount(), this little workaround worked for me.

This is the static event handler I use for the Strip that shows the "Loading..." message (in OP's case, it's the transparent Strip).

/** 
 * @param   {object}   event
 * @param   {$w.ColumnStrip}    event.target 
 */
export async function loadingStrip_viewportEnter(event) {
    const dataset = $w("#allOthersDataset");

    /** monkeypatch for wix_data.hasNextPage() */
    const hasNext = () => dataset.getCurrentPageIndex() < dataset.getTotalPageCount(); 

    if (hasNext()) {
        await event.target.expand();
        await dataset.loadMore(); 

        // `isVisible` property doesn't seem to work properly either...
        // so it will continue to load regardless
        event.target.isVisible && loadingStrip_viewportEnter(event);
        return;
    }
    event.target.collapse();
}

Do note that the isVisible property for the Strip doesn't work properly either, so it will keep loading until it runs out from the first time that the onViewportEnter handler is triggered. Though, it doesn't really matter too much as the strip will be collapsed eventually once it's loaded everything. For OP's case, it probably doesn't matter either since it's invisible.

Hope this helps someone.

Neff Design

Jun 19, 2020

Here are the last few occurrences. hasNextPage still comes back at true each time. Also notice how getCurrentPageIndex increments well past the actual 5 pages.

5
5
Done loading more data
{...}
totalPage: 
5
pageSize: 
6
count: 
25
hasNextPage: 
true

5
6
Done loading more data
{...}
totalPage: 
5
pageSize: 
6
count: 
25
hasNextPage: 
true

5
7
Done loading more data
{...}
totalPage: 
5
pageSize: 
6
count: 
25
hasNextPage: 
true

Salman2301

Jun 19, 2020

•

Yes i had the issue with last time too

The reason for that it

It's not a hasNextDynamicPage()

Note this function is not exist

and this is what you are looking for

For now just use

.getNextDynamicPage()

It will return the URL or an empty string "" if there is no URL

$w('#dynamicDataset').getNextDynamicPage() .then(url => { if(url) { // has Next dynamic page } else { // current page is the last dynamic page } })

For example if you have a category dynamic page

let say we have 10 product and limit for the category dynamic dataset is set to 5 (means show 5 product per dynamic page)

then if the user is on the first page

the repeater will show from 1-5 products and

hasNextPage will return true

On the Secod page hasNextPage should be false

and the repeater will show 5-10

Salman2301

Jun 19, 2020

•

Replying to

Yes correct i update the sample code As it's a promise, so have to use .then or await to resolve the promise

Neff Design

Jun 19, 2020

Replying to

You'll notice I tried that (see my reply above). It always returns null. I'm confused on what URL you expect to be returned? The data set doesn't have a URL. I'm trying to identify if there is another "page" of data to load into the repeater.

Salman2301

Jun 19, 2020

•

Replying to

I am confusing your issue with mine I have update the code to show some logs Replace this code and share the logs


$w.onReady(() => {

  $w("#stripNextPage").onViewportEnter(async () => {

    console.log($w("#dbProperties").getTotalPageCount()); // 2
    console.log($w("#dbProperties").getCurrentPageIndex()); // Increments on each call

 await $w("#dbProperties").loadMore()

    console.log("Done loading more data");

 let hasNextPage = $w("#dbProperties").hasNextPage();

    console.log({
      totalPage : $w("#dbProperties").getTotalPageCount(),
      pageSize: $w("#dbProperties").getPageSize(),
      count: $w("#dbProperties").getTotalCount(),
      hasNextPage
    });

 //If no more pages exist collapse strip
 if (!hasNextPage) {
      $w("#stripNextPage").collapse();
    }
  });

});

How can we make the product better?

Wishlist Page is the official platform for requesting new features. You can vote, comment, and track the status of the requested features.