bootstrap_select wont toggle open with YADCF

Question

I am using bootstrap-select as a custom_select option for filter type multi_select and select with yadcf. Both are displaying fine and are being initialized but the dropdown wont toggle open or closed when clicked for select or multi_select. I can see that there are options in the dropdown as I have set to 'selectAll'. See here

See my code below:

    var _bootstrapselect;
    yadcf.initSelectPluginCustomTriggers(
        function ($filterSelector) {
            _bootstrapselect = $filterSelector.selectpicker({
            });
            _bootstrapselect.selectpicker('selectAll');               
        },
        function ($filterSelector) {
            _bootstrapselect.selectpicker('refresh');
        },
        function ($filterSelector) {
            _bootstrapselect.selectpicker('destroy');
        });

    yadcf.init(table, [           
        {
            column_number: 0,
            filter_container_id: 'external_filter_container_0',
            filter_type: 'multi_select',
            select_type: 'custom_select',
            style_class: 'form-control selectpicker',
            filter_default_label: 'Filter Column',
            filter_reset_button_text: false,
        }
    ]);

I have no console errors so it does seem like my boostrap js and bootstrap css files are being loaded in the correct order. I also have successfully setup a bootstrap-select outside of yadcf and it works fine. Any help would be appreciated.

Answer 1

I was able to resolve all issues with bootstrap-select and yadcf. Don't use nuget package manager to download bootstrap-select. That was the issue. use CDNJS from link here. Also, Place the script link at the bottom after bootstrap, datatables and yadcf scripts.

Final Code:

    var _bootstrapselect;
    yadcf.initSelectPluginCustomTriggers(
        function ($filterSelector) {
            _bootstrapselect = $filterSelector.selectpicker({});
        },
        function ($filterSelector) {
            _bootstrapselect.selectpicker('refresh');
        },
        function ($filterSelector) {
            _bootstrapselect.selectpicker('destroy');
        }
    );

    yadcf.init(table, [           
    {
        column_number: 0,
        filter_container_id: 'external_filter_container_0',
        filter_type: 'multi_select',
        select_type: 'custom_select',
        style_class: 'form-control selectpicker',
        filter_default_label: 'Filter Column',
        filter_reset_button_text: false,
    }
]);