selectric-change event not fired on mobile

[kobelobster]

Hello,

my config looks like this

$('select.filter-select');
   .selectric({
       disableOnMobile: false,
       onInit: () => {
           $('.filter-box__content').removeClass('blurred');
           // TODO - If is mobile remove first option from selects
       },
       onBeforeOpen: () => {
           const items = $('.selectric-items li');
           items.removeClass('selected');
           items.removeClass('highlighted');
       },
       onOpen: () => {
           const items = $('.selectric-items li');
           items.removeClass('selected');
           items.removeClass('highlighted');
       },
       labelBuilder: (curItem) => {
           const outerSelect = $(curItem.element[0].parentElement);
           return outerSelect.data('filter');
       }
   .on('selectric-change', (event, element, selectric) => {
       $('.mapudo-indicator').show();
       window.location.href = selectric.items[selectric.state.selectedIdx].value;
   });

When I now open my page on mobile, open a select box and select an entry I would hope that the selectric-change event is fired, but in fact it is not.

If I use nativeOnMobile: false it is fired, however, I would like for the user to have the default select box behavior on mobile. Do I need to manually bind an change event on the select boxes as well for mobile to work? Is this the expected behavior?

[xserber]

I manually tied the event. Note the use of , you need to change the parent's class for work

[kobelobster]

Hi @xserber. Yes, that's what I also did, manually bound the events to the same functions. It's not beautiful but gets the job done.

[jeffceriello]

Hi, I don't get how you worked around the issue. Could you please show me how to do it?

Thanks

[kobelobster]

@jeffceriello What I did was simply listening to the change event of the select box.