2 Comments

The way a kendo datasource retrieves data can be configured via the transport object.

This object contains configuration objects for specifying the way CRUD operations are executed.

Each of these configuration objects contain the properties

contentType (Type of the HTTP request)

dataType (Type of the HTTP response request)

 

The way you configure these properties defines the way how the C# REST Service code must be written. If you use the default contentType (application/x-www-form-urlencoded; charset=UTF-8). the data is sent inside the forms collection with the name "models" of the request, the name of this property is set in the parameterMap function:

var dataSource = new kendo.data.DataSource({
    transport: {
        update: {
            // The default HTTP request (send) type.
            contentType: "application/x-www-form-urlencoded; charset=UTF-8",
            // The expected HTTP response (receive) type.
            dataType: "json"    
        }
    },
    parameterMap: function (options, operation) {
        if (operation !== "read" && options.models) {
            return { models: JSON.stringify(options.models) };
        }
    }
});

C# code to handle this update request:

public List<MyDto> Post()
{
    string json = _request["models"];
    var records = new List<MyDto>();
    if (!string.IsNullOrWhiteSpace(json))
    {
        records = JsonConvert.DeserializeObject<List<MyDto>>(json);
        // Update data in database …
    }

    return records;
}

MyDto is just a POCO class.

 

If you want to sent the data as a parameter of the Post method, you should use "contentType:"application/json"":

var dataSource = new kendo.data.DataSource({
    transport: {
        update: {
            // The default HTTP request (send) type.
            contentType: "application/json",
            // The expected HTTP response (receive) type.
            dataType: "json"    
        }
    },
    parameterMap: function (options, operation) {
        if (operation !== "read" && options.models) {
            return { models: JSON.stringify(options.models) };
        }
    }
});

C# code to handle this update request:

public List<MyDto> Post(List<MyDto> records)
{
    // Update records in database ...

    return records;
}

2 Replies to “Kendo UI – jQuery and dataSource–transport–contentType”

  1. Thank you so much for this!!!

    I was tearing my hair out trying to figure out why it was sending the data across as form data instead of json, even though I had contentType: “application/json”.

    Turns out I had to do this…

    if (operation !== “read” && options.models) {
    return JSON.stringify(options);
    }

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Related Posts