Repeater doesn’t scroll to top after clicking pagination bar

Ask the community
,
1

Hello all, I’m having a bit of a issue adding a pagination bar to my repeater. I currently display 12 items, but I would like to add more and have it continue on a second page.

The issue I am running into is that when I click “page 2”, it stays loaded at the bottom of the screen where the pagination bar is, instead of scrolling to the top to see the next listing.

I have scoured the forums and found similar issues that have been answered, but the code that is used doesn’t seem to work for me. Here is one example of code I tried:

import wixWindow from ‘wix-window’ ;

$w . onReady ( function () { $w ( ‘#pagination1’ ). onClick (() => { $w ( ‘#header1’ ). scrollTo ();})});

Any help would be greatly appreciate. Thank you !

2

Without knowing your exact page-setup, the issue could because you are working with → $w ( ‘#header1’ ← the header normaly belongs to the MASTER-PAGE.

You can make a test.

Place a line (shape-element) onto the very top of your page (but still under the header) and then change your code to scroll to the line, instead of scrolling to the header.

Your code wil run on your page not on master-page.

Of course you also can do it the opposite direction.

Your code in general looks good.

3

Thanks for your reply, but I still can’t seem to get it to work.

I do have some other code running on the page. Could it be that they are interfering with one another? The entire code reads as follows:

$w . onReady ( function () {
$w ( ‘#dataset1’ ). onReady (() => {
$w ( “#listRepeater” ). onItemReady (( $item , itemData ) => {
let sTitle = itemData . external ;
if ( sTitle === “” || sTitle === null || sTitle === undefined ) {
$item ( “#button7” ). hide ();
} else {
$item ( “#button7” ). show ();
}

    }); 
});

})

import wixWindow from ‘wix-window’ ;

$w . onReady ( function () {
$w ( ‘#pagination1’ ). onChange (() => {
$w ( ‘line6’ ). scrollTo ();
})
});

4

When working with Velo, you should only use one $w.OnReady on each page.

In addition, you’re missing the # that should go with line6.

This is the code formatted properly.

import wixWindow from 'wix-window';

$w.onReady(function () {
    $w('#dataset1').onReady(() => {
        $w("#listRepeater").onItemReady(($item, itemData) => {
            let sTitle = itemData.external;
            if (sTitle === "" || sTitle === null || sTitle === undefined) {
                $item("#button7").hide();
            } else {
                $item("#button7").show();
            }

        });
    });

    $w('#pagination1').onChange(() => {
        $w('#line6').scrollTo();
    })
})
5

Thank you so so much! Everything is working perfectly. I am extremely grateful!

6

Hello, I am new to WIX and so also new to this forum. Is the forum only for WIX Studio or SHOULD THIS CODE WORK FOR BASIC WIX TOO? I am using basic WIX.

I have added a Pagination bar for a Pro Gallery and it works very will but I also need to scroll up to top of gallery after paginating.
1st - the API wix-window does not exist for me but there is a wix-window-frontend. But neither works for me.

Page and skip to top

Note - The editor is highlighting both the pagination element and the anchor element which is what I get no matter which API I import. Also, the documentation I’ve found uses an X -Y position for scrollTo rather than an Anchor label.

Suggestions???
Mike