1 Answer, 1 is accepted
Hi Lee,
You can change the text of the placeholder of the filterInput as demonstrated below:
$("#dropdownlist").data('kendoDropDownList').filterInput.attr('placeholder', 'Search...')
Here is a Dojo example where this is demonstrated - https://dojo.telerik.com/gqqyxINP.
I hope this helps.
Regards,
Neli
Progress Telerik
Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.
prior to updating to Kendo 2025 Q2 it always said "Search". Now all of them say "Filter" how do I update all of them globally, prior to initialization, so I don't have to go through each one in my projects and update them manually and then remember to update each new one manually in the future? I know for many things I can use the .extend method. Is there something similar here?
I also noticed that the word "Filter" that suddenly started appearing there is not localized. When I switch to German, everything else for kendo translates but not that.
Hi Lee,
The observed change with the text of the filter input is intended. However, with previous versions there was no text in the filter input. Here is a Dojo where this is demonstrated: https://dojo.telerik.com/YczlaFls. As you mentioned that the text on your side is 'Search', please let me know if I am missing something from your scenario.
To change the text on multiple DropDownLists you can use a common selector and change the placehodler text:
$('.k-dropdownlist-popup [role="searchbox"]').attr('placeholder', 'Search...')
The above is demonstrated in the Dojo linked here - https://dojo.telerik.com/rbGTuklI.
Regarding localization, indeed currently the filter input text is not included in the messages, thus I logged a new item on your behalf. Below you will find a link to it in the Feedback Portal and the related issue in our GitHub repository:
Let me know in case you have any additional questions on the matter.
Regards,
Neli
Hi Lee,
A possible workaround to change the default text before initialization is to override the respective function that returns the text. Below you will find such an example:
kendo.ui.List.fn._filterHeader = function() {
this.filterTemplate = '<div class="k-list-filter">' +
'<span class="k-searchbox k-input k-input-md k-rounded-md k-input-solid" type="text" autocomplete="off">' +
kendo.ui.icon({ icon: "search", iconClass: "k-input-icon" }) +
'</span>' +
'</div>';
this.actionSheetFilterTemplate = `<div class="k-actionsheet-titlebar-group k-actionsheet-filter">${this.filterTemplate}</div>`;
if (this._isFilterEnabled()) {
this.filterInput = $('<input class="k-input-inner" type="text" />')
.attr({
placeholder: this.element.attr("placeholder") || "Custom filter text",
title: this.options.filterTitle || this.element.attr("title"),
role: "searchbox",
"aria-label": this.options.filterTitle,
"aria-haspopup": "listbox",
"aria-autocomplete": "list"
});
}
},
Here is a Dojo example where this is demonstrated: https://dojo.telerik.com/MNmHakwm.
When the feature request linked in my previous reply is implemented there will be a dedicated configuration option in the messages that will allow customizing the text in the filter input. The issue is related to a new functionality, that needs to be enhanced, thus it is not considered a bug, but a feature.
I already discussed the issue with the team and we will do our best to prioritize it, so the item to be implemented for the Q3 2025 release scheduled for September. However, please note that before the issue is implemented and the item passes all the needed tests I could not comit to a specific timeframe. Generally, we avoid providing exact timelines to ensure we do not make promises we might not be able to keep.
In case you have additional question, please let me know.
Regards,
Neli