davidstutz / bootstrap-multiselect

JQuery multiselect plugin based on Twitter Bootstrap.
https://davidstutz.github.io/bootstrap-multiselect/
Other
3.67k stars 1.98k forks source link

'onSelectAll' event handler not responding to .multiselect('selectAll') #1225

Closed HeyWrecker closed 2 years ago

HeyWrecker commented 2 years ago

Hello,

I am mounting bootstrap-multiselect (v. 1.1.1) in a React hook component and using the following function to initialize it in the useEffect hook:

function initBootstrapMultiselect(currentRef) {
    // Initialize multiselect
    jQuery(currentRef).multiselect({
        buttonWidth: '100%',
        buttonTextAlignment: 'left',
        includeSelectAllOption: true,
        widthSynchronizationMode: 'always',
        onChange: function(option, checked, select) {
            handleOnChange(option, checked);
        },
        onSelectAll: function(options) {
            console.log('24', options)
            handleOnSelectAll(options);
        },
        onDeselectAll: function(options) {
            handleOnDeselectAll(options);
        }
    });

    jQuery(currentRef).multiselect('dataprovider', renderDataProvider())
    jQuery(currentRef).multiselect('selectAll', false);
}

By and large, this appears to work. The plug-in is mounting, rendering, populating with data, and all of the event handlers are called when the options are selected and/or deselected.

The only issue that I appear to be running into is that the onSelectAll event handler is not responding the jQuery(currentRef).multiselect('selectAll', false);.

I'm not certain where to go from here. Any advice would be incredibly helpful. Thanks!

Rick

HeyWrecker commented 2 years ago

As an update, I worked around this issue by updating my data array of objects to also include selected and disabled` properties and then ran these after the initialization:

jQuery(currentRef).multiselect('dataprovider', props.optionData);
jQuery(currentRef).multiselect('updateButtonText');