KendoUI AutoComplete widget does not update filter when empty

Question

I've got an AutoComplete widget bound to a datasource like so:

<input data-filter="contains" data-role="autocomplete" data-bind="source: styleData" data-text-field="style" id="style-name" />

I have the following items in the datasource:

ABC123
123AC
ZZZ

When I type A into the AutoComplete box it automatically filters out the last item as expected. Then if I hit B, the second item is also filter out. If I then hit backspace, the second item reappears. With a final backspace however, the third item does not appear. $('#style-name').getKendoAutoComplete()'s value resolves to an empty string, but the dataSource's filter still has {field: 'style', logic: 'contains', value: 'A'} listed.

I've tested on Firefox 30 and IE11 on Windows 8.1 Update 1 and both give the same results.

score 1 · Answer 1 · answered Jun 17 '14 at 21:13

1

This is because

data-min-length="1"

This property only triggers the auto-complete when you have at least one character typed.

If you want to display all results without the 1 character minimum, then you are probably looking for a ComboBox.

answered Jun 17 '14 at 21:13

Chris Fremgen

4,649
1
26
26

Sorry, I added that after it wasn't working hoping that it would clear itself or something when the length of the box went below the specified value. Removing it does not solve the problem. I've updated the original question to reflect this. Also I don't want a combobox because eventually there will be hundreds of records and I don't require the user to actually select an option, partials should still filter the data. – CuddleBunny Jun 17 '14 at 21:18

score 0 · Accepted Answer · answered Jun 18 '14 at 14:22

So I spent some time perusing the source and I guess this functionality is intended as indicated by the following lines from the search function (kendo.autocomplete.js, Q1 2014, line 301):

if (!length) {
    that.popup.close();
} else if (length >= that.options.minLength) {
    that._open = true;

    that._filterSource({
        value: ignoreCase ? word.toLowerCase() : word,
        operator: options.filter,
        field: options.dataTextField,
        ignoreCase: ignoreCase
    });
}

!length of 0 evaluates to true and closes the popup without changing the filter. I am going to move the _filterSource line outside of the conditional to solve the problem.

KendoUI AutoComplete widget does not update filter when empty

2 Answers2