How to reset the dropdown list to show all elements

2 posts, 0 answers
  1. Csaba Gyozo
    Csaba Gyozo avatar
    4 posts
    Member since:
    Mar 2016

    Posted 15 May 2017 Link to this post

    I have added some client script to a dropdown that automatically highlights and checks an item when pressing enter and also appends a comma after the text. The problem is that when I press enter the dropdown still remains filtered. How can I reset the dropdown to show all the items.

    Here is the problem as a gif:

    Error

    When I press enter Argentina gets selected, the comma is appended but the dropdown list isn't reset to show all the items. How do I do this? Any other suggestions to how can I append the comma automatically without using any hacks are also welcome.

     

    Code:

     

    <telerik:RadComboBox ID="rcbCountries" runat="server" Width="287px" CheckBoxes="true"  EnableCheckAllItemsCheckBox="true"
        CheckedItemsTexts="DisplayAllInInput" AllowCustomText="true" EnableLoadOnDemand="false" MaxHeight="400px" Height="400px"
        NoWrap="true" AutoPostBack="false" EmptyMessage="Partner's country" MarkFirstMatch="true" AutoCompleteSeparator=", "
        Filter="Contains"
        OnClientBlur="rcbCountries_Blur" OnClientFocus="otherCB_Focus" OnClientItemChecked="rcbCheckboxChecked"
        OnClientKeyPressing="rcbCheckboxKeyPressed" OnClientDropDownClosing="rcbDropdownClosing"
         
        EnableTextSelection="False">
    </telerik:RadComboBox>

     

    function rcbCheckboxKeyPressed(sender, args) {
        if (args.get_domEvent().keyCode == 13) {
            var highlighted = sender.get_highlightedItem();
            if (!highlighted)
                sender.highlightMatches();
            var highlighted = sender.get_highlightedItem();
     
            if (highlighted) {
                highlighted.check();
                rcbCheckboxChecked(sender, args);
     
                $(sender.get_element()).data('keep-dropdown-open', true);
            }
        }
    }
     
    function rcbCheckboxChecked(sender, eventArgs) {
        //hack: There is no event to handle that allows us to add a comma at the end
        setTimeout(function () {
            appendComma(sender);
        }, 0);
    }
     
    function rcbDropdownClosing(sender, args) {
        if ($(sender.get_element()).data('keep-dropdown-open') === true)
            args.set_cancel(true);
    }
     
    function appendComma(sender) {
        if (sender.get_checkedItems().length == 0) return;
     
        var text = $.trim(sender.get_text());
        if (text.length > 0 && !text.match(/,\s*$/)) {
            sender.set_text(text + ", ");
        }
    }

     

     

     

     

  2. Csaba Gyozo
    Csaba Gyozo avatar
    4 posts
    Member since:
    Mar 2016

    Posted 15 May 2017 in reply to Csaba Gyozo Link to this post

    It seems I cannot edit so I post this as a reply instead:

    I have to press backspace and space to trigger the refresh of the dropdown. How can I do this programatically.

Back to Top