Change custom text searchBuilder background

sarooptrivedi

Hello Team,
As per below example I changed my searchBuilder text but filter count not appear in custom text.
https://datatables.net/extensions/searchbuilder/examples/customisation/buttonText.html

I need to change the counter and color back ground when filter applied as per below example for custom text of searchbuilder.

http://live.datatables.net/qipuyoyu/2/edit

kthorngren

Maybe I'm not understanding the issue but the filter count seems to work in your test case. See the screenshot:

Kevin

sarooptrivedi

No it is not working. This is old example I saw you. This is not custom text button. If you add the custom text for button then this color will not work

language: {
        searchBuilder: {
            button: 'Filters',
            add: '<i class="fa-solid fa-filter"></i>Filters',
            title: {
                0:'Filters',
                _: 'Filters (%d)'
            },
            delete: '<i class="fa-solid fa-delete-left" style="color:DarkRed;Height:15px"></i>',
            clearAll:'<i class="fa-solid fa-filter-circle-xmark" style="color:DarkRed;Height:15px"></i>Reset'

        }
    },

This is button code

{
extend: 'searchBuilder',
className:'Filtre',
config: {
filterChanged: function (count) {
if (count) {

                        $('.Filtre').text(table.i18n('searchBuilder.collapse', { 0: 'Filters', _: 'Filters (%d)' }, count));
                        $('button.dt-button.Filtre').css('background-color', "green");
                    } else {
                        $('.Filtre').text(table.i18n('searchBuilder.collapse', { 0: 'Filters', _: 'Filters (%d)' }, count));
                    }
                }
            }
        },

kthorngren

Please update the test with your code to show the issues you are having so we can help debug.

Kevin

sarooptrivedi

I figure out with issue. Above code is working as expected. I face the issue because in my site.css class is override the datatables css class.

Thank you for looking