Filter ComboBox with CheckBoxes support enabled

1 posts, 0 answers
  1. Telerik Admin
    Telerik Admin avatar
    1629 posts
    Member since:
    Oct 2004

    Posted 22 Jul 2016 Link to this post


    Telerik Product and Version

    UI for ASP.NET AJAX R2 2016 607

    Supported Browsers and Platforms

     IE8+, Chrome current and previous, Firefox current and previous

    Components/Widgets used (JS frameworks, etc.)

    .NET 4.0/4.5  C#


    The ComboBox filtering and MarkFirstMatch functionalities are not supported when CheckBoxes are enabled. This example demonstrates a custom approach that enables filtering through a TextBox embedded in the ComboBox' Header Template.

    <telerik:RadComboBox ID="RadComboBox1" runat="server" CheckBoxes="true" CheckedItemsTexts="DisplayAllInInput" Width="300px"
        DataTextField="Name" DataValueField="ID" OnClientDropDownClosing="OnClientDropDownClosing">
            <telerik:RadTextBox runat="server" ID="RadTextBox1" Width="100%" ClientEvents-OnLoad="OnLoad">
    <script type="text/javascript">
        var $T = Telerik.Web.UI;
        var originalFunction = $T.RadComboBox.prototype.highlightAllMatches;
        var textBox;
        function OnLoad(sender, args) {
            var comboBox;
            Sys.Application.add_load(function () {
                textBox = sender;
                comboBox = $find("RadComboBox1");
            $telerik.$(sender.get_element()).on("keyup", function (e) {
        function OnClientDropDownClosing(sender, args) {
            sender.get_items().forEach(function (item) {
        $T.RadComboBox.prototype.highlightAllMatches = function (text) {
  , text);

    protected void Page_Load(object sender, EventArgs e)
        if (!IsPostBack)
            RadComboBox1.DataSource = CreateItems();
    protected List<Person> CreateItems()
        List<Person> data = new List<Person>();
        data.Add(new Person(1, "Anna"));
        data.Add(new Person(2, "Bob"));
        data.Add(new Person(3, "Colin"));
        data.Add(new Person(4, "Daniel"));
        data.Add(new Person(5, "Ellen"));
        return data;
    public class Person
        public int ID { get; set; }
        public string Name { get; set; }
        public Person(int id, string name)
            ID = id;
            Name = name;

Back to Top