What's Wrong With My KendoUI Data Source

Question

I'm working on getting an AutoComplete widget to work. This code works:

    var clients = [{ "ClientId": 123, "Name": "Steve" }, { "ClientId": 124, "Name": "Julie" }];

    $("#client").kendoAutoComplete({
        minLength: 1,
        filter: "contains",
        placeholder: "Type client name...",
        dataTextField: "Name",
        dataValueField: "ClientId",
        template: kendo.template($("#template").html()),
        dataSource: clients,
        height: 370,
    }).data("kendoAutoComplete");

However, when I try to use an actual remote dataSource, the browser displays a loading image but never shows the selected name. Here's the alternate data source:

var clients2 = new kendo.data.DataSource({
                type: "jsonp",
                transport: {
                    read: {
                        dataType: "jsonp",
                        url: "/api/clients"
                    }
                }
            });

Looking in Fiddler or Network tab in Chrome Dev Tools, the result of the api call is:

HTTP/1.1 200 OK
Cache-Control: no-cache
Pragma: no-cache
Content-Type: application/json; charset=utf-8
Expires: -1
Server: Microsoft-IIS/8.0
X-AspNet-Version: 4.0.30319
X-SourceFiles: =?UTF-8?B?QzpcVXNlcnNcU3RldmVcRG9jdW1lbnRzXEdpdEh1YlxkZGQtdmV0LXNhbXBsZVxGcm9udERlc2tTb2x1dGlvblxGcm9udERlc2suV2ViXGFwaVxjbGllbnRz?=
X-Powered-By: ASP.NET
Date: Thu, 05 Sep 2013 21:08:28 GMT
Content-Length: 141

[{"ClientId":"00000000-0000-0000-0000-000000000000","Name":"Steve Smith"},{"ClientId":"00000000-0000-0000-0000-000000000000","Name":"Julie"}]

So, what's the difference and why isn't it working? The data source is clearly being used, since I can see the network calls happen with each additional character I type into the textbox.

Thanks!

Answer 1

Thanks to @chris_a_wagner on twitter. The culprit was me specifying jsonp for the format instead of json (I forget why I originally had that). Switching to json works.