Kendo UI Grid Repeat the request to the server error

Question

I do not know how to describe the specifics, you can see an error in this video: http://www.youtube.com/watch?v=D6NPd-j2erg&feature=youtu.be And this is the code I use:

$(document).ready(function () {
    var dataSource = new kendo.data.DataSource({
        transport: {
            read: {
                url: "/customer/get",
                dataType: "json",
                type: "POST"
            },
            update: {
                url: "/customer/edit",
                dataType: "json",
                type: "POST"
            },
            destroy: {
                url: "/customer/delete/",
                dataType: "json",
                type: "POST"
            },
            create: {
                url: "/customer/add",
                dataType: "json",
                type: "POST"
            }
        },
        batch: false,
        pageSize: 20,
        serverPaging: true,
        serverFiltering: true,
        serverSorting: true,
        schema: {
            data: "Data",
            total: "Total",
            model: {
                id: "CustomerId",
                fields: {
                    CustomerId: { editable: false, nullable: true },
                    Name: { validation: { required: true } },
                    Code: { type: "string", editable: false }
                }
            }
        }
    });

    $("#grid").kendoGrid({
        dataSource: dataSource,
        height: 430,
        filterable: true,
        sortable: true,
        pageable: {
            refresh: true,
            pageSizes: [10, 20, 30],
            buttonCount: 10
        },
        toolbar: ["create"],
        columns: [
            { field: "Name", title: "Name" },
            { field: "Code", title: "CODE", width: "100px" },
            { command: ["edit", "destroy"], title: " ", width: "200px" }],
        editable: "popup"
    });
});

Do I have made any mistake? I have added the Kendo Ui library following:

<script src="/Scripts/kendo/2013.1.319/jquery.min.js"></script>
<script src="/Scripts/kendo/2013.1.319/kendo.all.min.js"></script>
<script src="/Scripts/kendo/2013.1.319/kendo.aspnetmvc.min.js"></script>
<script src="/Scripts/kendo.modernizr.custom.js"></script>

Answer 1

Indeed there is a breaking change with the new version of jQuery which affects the Kendo Q1 2013 version 2013.1.319

http://jquery.com/upgrade-guide/1.9/#jquery-ajax-returning-a-json-result-of-an-empty-string

Since the empty result returned from the server in case everything is executed properly on the server side - the error event is rised because the empty result is not valid json.

To work-around this I would suggest you to return empty array from the server.

For the ASP.NET users which use the Extensions they can use:

return Json(new object[0].ToDataSourceResult(request,ModelState));

Basically a valid result from the server after update/delete operations should be similar to this one:

{"Data":[],"Total":0,"AggregateResults":null,"Errors":null}

This will be resolved internally by the ToDataSourceResult extension for ASP.NET MVC users with the next internal build (we will most likely add it tomorrow) and it will also be added to the breaking changes/troubleshooting sections of the documentation.