Multiselect with autoClose false - Delete input text keeps the items selected

5 posts, 0 answers
  1. Salim
    Salim avatar
    102 posts
    Member since:
    Jun 2016

    Posted 24 Jan 2017 Link to this post

    We have 2 weird problems in MultiSelect when autoClose is set to false. They were reproduced in the following example:

    Problem 1: Delete input text keeps the items selected

    Steps to Reproduce: 

    1.Write in the text "le", and then click "enter"

    2. Erase in the text everything. The item "Lebanon" remains selected

    Problem 2: the entered text remains

    Steps to Reproduce:

    1. Write in the text "le", and then click "enter". The item "Lebanon" is selected (which is correct), but the text "le" remains (which should be removed)

  2. Salim
    Salim avatar
    102 posts
    Member since:
    Jun 2016

    Posted 24 Jan 2017 Link to this post

    Also, an additional problem, which is the following:

    MultiSelect issue after deleting selected item

    Step to reproduce Scenario:

    Select “4”
    Erase it and open the multiselect the “4” remains focused even that the option highlightFirst is set to true 

  3. Dimiter Topalov
    Dimiter Topalov avatar
    1298 posts

    Posted 26 Jan 2017 Link to this post

    Hi Salim,

    Thank you for contacting us about the described issues. The first one (deleting input keeps the item selected) has already been logged, and you can expect a fix in a future release of Kendo UI. You can track the GitHub issue in our repository:

    The other two described behaviors are actually expected and intended. The text, described in Problem 2 remains when the autoClose option is set to false (otherwise it is cleared). This behavior intends to allow the user to continue selecting from the filtered items, if there is more than one item, passing the filter criteria.

    The highlightFirst option is applicable for the first opening when the widget is created. I am sorry if the documentation is not clear enough or misleading.

    The desired behavior can be achieved via some custom coding. A possible approach is to handle the deselect event, and manually remove the k-state-focused class, and adding it to the desired list item, e.g.:

    I hope this helps.

    Dimiter Topalov
    Telerik by Progress
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  4. Brian
    Brian avatar
    1 posts
    Member since:
    Jan 2011

    Posted 25 Feb 2019 in reply to Dimiter Topalov Link to this post

    Is there a work around for Problem 2 listed above. I cannot think of a reason for the default action and I don't know of other controls that act this way.

    Thanks for your help

  5. Nencho
    Nencho avatar
    1890 posts

    Posted 27 Feb 2019 Link to this post

    Hello Salim,

    Regarding the requested workaround for the described behaviour in #2 - you can handle the change event of the MultiSelect and clear the current input value. In addition, you would need to ensure that the filtering of the dataSource is cleared:

    change: function(e){

    Here is a dojo example, demonstrating the above-suggested implementation:

    Hope this would help.

    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Back to Top