onCurrentIndexChanged not firing

Ask the community
,
1

Within a dynamic page, the onCurrentIndexChanged( ) event does not seem to be firing when I click Preview on the collection navigation strip in the Wix Editor and navigate through the collection of items. It also doesn’t seem to fire when the page is ready or the dataset is ready.

Does this event work? What am I doing wrong? I have tried registering my event handler both in the Dataset’s properties (with the + button) as well as manually on the page ready event.

Thoughts? Thanks.

2

Hi,

I have tried and was able to reproduce it - indeed onCurrentIndexChanged() never fires for a Dynamic Page dataset, also I noticed getCurrentIndex() always returns 0 on Dynamic Pages.

I will clarify with product people how it is supposed to work and come back to you ASAP.

Thanks

3

Any update on this? Many thanks.

4

Yes, it is a bug and we will fix it.

Thanks for pointing this to us

5

hey there…

@motiejus and I checked your issue and wanted to make sure again:
When “clicking the next item”, are you refereeing to the upper-right corner navigation buttons?
(see image: nav_panel.png)

6

Do you have an update with this issue?

7

{UPDATE}
Here’s some code that ALMOST works… for the first time the index changes, the repeater’s Formatted Price changes perfectly… but the second time that the index changes, the repeater’s formatted data changes to a NaN. Thoughts???

$w.onReady( function () {
$w(“#dynamicDataset”).onReady(() => {
console.log(‘ready’)
populateFormattedPrice();
} );

$w(“#dynamicDataset”).onCurrentIndexChanged( (index) => {
console.log(‘index has changed’)
populateNewFormattedPrice();
} );

} );

function populateFormattedPrice() {
$w(“#dynamicDataset”).onReady(() => {
$w(‘#repeater1’).forEachItem( ($item, itemData, index) => {
const numberWithCommas = (x) => {
return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, “,”);
}
$item(‘#priceText’).text = “$” + numberWithCommas(parseInt($item(‘#priceText’).text, 10));
} );
});
}

function populateNewFormattedPrice() {
$w(“#dynamicDataset”).onReady(() => {
$w(‘#repeater1’).onItemReady( ($newItem, itemData, index) => {
console.log(‘new item ready’)
const numberWithCommas = (x) => {
return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, “,”);
}
$newItem(‘#priceText’).text = “$” + numberWithCommas(parseInt($newItem(‘#priceText’).text, 10));
} );
});
}

8

I’ve found a way to make this work. It would make more sense for onCurrentIndexChanged to either return a promise or to have an onPageLoaded function, however, I’ve combined the two to get at least my own desired results.

function formatItems () {
    $w('#itemRepeater').forEachItem(($item, itemData, index) => {
        // Change whatever needs to be changed after new items loaded
    }
}

$w.onReady(function () {
    $w('#mediaDataset').onReady(formatItems);
    $w('#mediaDataset').onCurrentIndexChanged((index) => {
        $w('#mediaDataset').loadPage($w('#mediaDataset').getCurrentPageIndex())
            .then(formatItems);
    });
});