Kendo UI AutoComplete datasource transport reads only once
Asked Answered
H

1

14

I'm becoming crazy with Kendo UI AutoComplete component. I'm using my own functions to access data with jQuery, so I have to set the AutoComplete dataSource.transport.read as a function. The code is something like this.

minLengthAtocomplete = 3;

$('#autocomplete').kendoAutoComplete({
    minLength : 3,
    filter : "contains",
    dataValueField : "key",
    dataTextField : "value",
    dataSource : new kendo.data.DataSource({
        transport : {
            read : _OnTransportRead
        },
        schema : {
            /* object schema */
        }
    })
});

function _OnTransportRead(e) {
    var text = $.trim(e.data.filter.filters[0].value);

    if (text && text.length >= minLengthAtocomplete) {
        _GetUsers(
            text,
            function onSuccess(data) {
                var users = [];
                 /* sets users with info in data */
                e.success(users);
            },
            function onError(error) {
                /* stuff with error */
            }
        );
    }
}

function _GetUsers(userName, onSuccess, onError) {
    /* Ajax to get users from DB */
}

This code runs perfectly, but dataSource.transport.read is called only the once. I do a first search with the text 'michae' and AutoComplete component runs its dataSource.transport.read as expected. Then, I add a one more letter to search for 'michael', and dataSource.transport.read is never called again. Is so frustrating!

I tried using autoSync dataSource property, manual dataSource Sync, set new dataSource objects on AutoComplete dataBound, but no luck.

What am I doing wrong? What am I forgetting?

Thanks in advance.

Hypothec answered 24/9, 2012 at 7:39 Comment(1)
I ran the exact code above and I get an error that says e.data.filter is undefined.Poser
C
26

You should enable serverFiltering in order for the data source to make requests every time.

$('#autocomplete').kendoAutoComplete({
    minLength : 3,
    filter : "contains",
    dataValueField : "key",
    dataTextField : "value",
    dataSource : new kendo.data.DataSource({,
        serverFiltering: true, 
        transport : {
            read : _OnTransportRead
        },
        schema : {
            /* object schema */
        }
    })
});
Charmion answered 24/9, 2012 at 20:32 Comment(2)
It's amazing! The AutoComplete works like a charm now! I spent much time dealing with it, I was becoming crazy! Many thanks!Hypothec
Same problem here and the solution was most helpful!Herculie

© 2022 - 2024 — McMap. All rights reserved.