Incrementally update Kendo UI autocomplete

Question

I have a Kendo UI autocomplete bound to a remote transport that I need to tweak how it works and am coming up blank.

Currently, I perform a bunch of searches on the server and integrate the results into a JSON response and then return this to the datasource for the autocomplete. The problem is that this can take a long time and our application is time sensitive.

We have identified which searches are most important and found that 1 search accounts for 95% of the chosen results. However, I still need to provide the data from the other searches. I was thinking of kicking off separate requests for data on the server and adding them the autocomplete as they return. Our main search returns extremely fast and would be the first items added to the list. Then as the other searches return, I would like them to add dynamically to the list.

Our application uses knockout.js and I thought about making the datasource part of our view model, but from looking around, Kendo doesn't update based on changes to your observables.

I am currently stumped and any advice would be welcomed.

Edit:

I have been experimenting and have had some success simulating what I want with the following datasource:

var dataSource = new kendo.data.DataSource({
transport: {
    read: {
        url: window.performLookupUrl,
        data: function () {
            return {
                param1: $("#Input").val()
            };
        }
    },
    parameterMap: function (options) {
        return {
            param1: options.param1
        };
    }
},
serverFiltering: true,
serverPaging: true,
requestEnd: function (e) {
    if (e.type == "read") {
        window.setTimeout(function() {
            dataSource.add({ Name: "testin1234", Id: "X1234" })
        }, 2000);
    }
}
});

If the first search returns results, then after 2 seconds, a new item pops into the list. However, if the first search fails, then nothing happens. Is it proper to use (abuse??) the requestEnd like this? My eventual goal is to kick off the rest of the searches from this function.

How does the first search fail? Is there any JavaScript error or there is error status code returned? It sounds like what you shared should be working fine — Petur Subev
I guess the search doesn't fail. When no search results or an empty JSON response is returned, then the autocomplete doesn't display. — xocomil

xocomil xocomil · Accepted Answer · 2013-03-12T16:58:26

I contacted Telerik and they gave me the following jsbin that I was able to modify to suit my needs.

http://jsbin.com/ezucuk/5/edit

Incrementally update Kendo UI autocomplete

1 Answers