Kendo autocomplete not showing results

Question

I'm trying to add a simple autocomplete to my page that will show the available numbers. I can see the call back to the controller and the list is populated in the controller but nothing is displayed on the front-end.

I've looked at the response in the browser and it is valid json data coming back.

HTML:

<input id="autocomplete"/>

JavaScript:

var dataSource = new kendo.data.DataSource({
    transport: {
        read: {
            url: "Entity/GetAvailableNumbers",
            dataType: "json",
            data: {
                q: function () {
                    return $("#autocomplete").val();
                }
            }
        }
    }
});
dataSource.read();
console.log(dataSource);
$("#autocomplete").kendoAutoComplete({
    dataSource: {
        data: dataSource
    }
});

Controller:

public ActionResult GetAvailableNumbers([DataSourceRequest] DataSourceRequest request, string text)
{
    // Simple loop that puts numbers into a list (usableNumbers)
    return Json(usableNumbers, JsonRequestBehavior.AllowGet);
}

Are you sure jsonp is the correct data type? – asawyer Jun 24 '13 at 20:36 — asawyer, Jun 24 '13 at 20:36
That was supposed to be json not jsonp. Sorry about that. – Mithrilhall Jun 24 '13 at 20:41 — Mithrilhall, Jun 24 '13 at 20:41
What is the type of usableNumbers? – Atanas Korchev Jun 25 '13 at 06:50 — Atanas Korchev, Jun 25 '13 at 06:50
Just plain old integers. – Mithrilhall Jun 25 '13 at 12:12 — Mithrilhall, Jun 25 '13 at 12:12

score 1 · Accepted Answer · answered Jun 27 '13 at 15:24

This is what ended up working for me.

JavaScript:

        $("#autocomplete").kendoAutoComplete({
            minLength: 2,
            filter: 'contains',
            dataSource: {
                type: "json",
                serverFiltering: false,
                transport: {
                    read: "Entity/GetAvailableNumbers"
                },
            }
        });

Kendo autocomplete not showing results

1 Answers1