jquery.selectBoxIt.js icon indicating copy to clipboard operation
jquery.selectBoxIt.js copied to clipboard

Not triggering on change for select element

Open bland-industries opened this issue 7 years ago • 3 comments

I am adding an on change event listener to a select element and it works when I don't use the this plug in. When I add selectBoxIt to my selects it doesn't trigger the event to the original select element. I can manually trigger it to get my listeners to work for testing purposes. I am using a vanilla js process to add and listen to the change event. Any thoughts?


Want to back this issue? Post a bounty on it! We accept bounties via Bountysource.

bland-industries avatar May 15 '17 18:05 bland-industries

This also affects me. The following acts as a workaroung in my case but I would like the onchange events to get automatically handled: var selectBox = select.data("selectBox-selectBoxIt"); selectBox.selectOption(select.val());

vensires avatar Aug 29 '17 13:08 vensires

ok, I've found out that the change event does trigger, but only if you bind your listener via jQuery.change. A listener that's bound natively via addEventListener will not trigger.

This should at least be documented on the project website.

h908714124 avatar Sep 21 '17 05:09 h908714124

hi, i have experienced the same issue and i tried to create and trigger manually the change event. Now 'change' event is detected by native event listener.

 var selectboxElements = $j('.droplist:not(.ranking) select, .datePicker select', this.element);
    selectboxElements.selectBoxIt({
        native: false,
        autoWidth: false,
        dynamicPositioning: false,
        isMobile: function () { }
    });

    selectboxElements.on('change', (function () {
        var value = null;
        return function (event) {
            var target = event.target;
            if (value !== event.target.value) {
                value = target.value;

                if (typeof (Event) === 'function') {
                    target.dispatchEvent(new Event('change'));
                } else {
                    var newEvent;                               //fix for IE
                    newEvent = document.createEvent('Event');
                    newEvent.initEvent('change', true, true);
                    target.dispatchEvent(newEvent);
                }
            }
        };
    })());

JetmirAhmati avatar Sep 27 '19 15:09 JetmirAhmati