Unable customise Select All/Unselect All text for list box component

[Liviu Cornea]

I am using a lis box with showSelectAll: true and I would like to customize Select All message( replace it with something different)

[YuvanShankar Arunagiri]

Hi Liviu,

Query:  I would like to customize Select All message?

We have checked your reported query and prepared the sample based on your requirement. Please refer the below code snippet and sample link. We can achieve your requirement by accessing the select all div element and adding the custom text.

[app.component.ts]:

onCreated(args) {

        this.listBoxObj.element.getElementsByClassName('e-all-text')[0].textContent = "Processed";

    }

 

    onChange(args) {

        if (args.event.currentTarget.classList.contains('e-selectall-parent')) {

            var proxy = this;

            setTimeout(function () {

                proxy.listBoxObj.element.getElementsByClassName('e-all-text')[0].textContent = args.value.length === 0 ? "Processed" : "UnProcessed";

            }, 10);

        }

    }

 

Sample link: https://stackblitz.com/edit/angular-5nve8z?file=app.component.ts

Could you please check the attached sample and get back to us, if you need any further assistance on this.

Regards, 

YuvanShankar A

[Liviu Cornea]

Thank you for suggestion but it is suboptimal. The usage of setTimeout to achieve the goal is not recommended . The component on its own should have an API to expose such property and settings allowing to customize that text (Select All/ Unselect All) as well a property that will help to put a label(title) for entire list.

My final goal is to use the list box for something like the picture below:

[YuvanShankar Arunagiri]

Hi Liviu,

We are validating your query and will update you the details on or before 21st October 2022.

Regards,

YuvanShankar A

[YuvanShankar Arunagiri]

Hi Liviu,

Currently, we don’t have support for your query, so we have logged this improvement as a feature. It will be available in any of our upcoming volume releases. You can track the status of this improvement
using below link from our feedback portal

Feedback link: https://www.syncfusion.com/feedback/38704/provides-to-modify-selectall-unselectall-text-of-list-box

Regards,

YuvanShankar A