Getting null while passing JSON from toolbar create button to C# controller

[Дмитрий]

Hello, need help:

I'm getting null in all fields of an incoming parameter (class that has all same fields as the JSON) while passing JSON from toolbar "create" button to C# controller. And If I try to add some additional properties in kendo like: contentType: "application/json; charset=utf-8", I get nothing at all in the controller.  

How can I pass JSON correctly? 

Kendo/Jquery:

$(document).ready(function () {
    //var arrayOfCheckedCheckBoxes = [];
    var crudServiceBaseUrl = "/api/Grid/",
                       dataSource = new kendo.data.DataSource({
                           transport: {
                               read: {
                                   url: crudServiceBaseUrl + "GetContacts",
                                   dataType: "json"
                               },
                               create: {
                                   url: crudServiceBaseUrl + "CreateContacts",
                                   type: "POST",
                                   dataType: "json"
                               }
                           },
                           batch: true,
                           pageSize: 20,
                           schema: {
                               model: {
                                   id: "ID",
                                   fields: {
                                       ID: { editable: true},
                                       Name: { type: "string" },
                                       Number: { type: "number" },
                                       Status: { type: "string" },
                                       Discontinued: {
                                           type: "boolean",
                                          value: false
                                       }
                                   }
                               }
                           }
                       });

    $("#grid").kendoGrid({
        dataSource: dataSource,
        pageable: true,
        height: 550,
        toolbar: ["create",
        {
            template: '<a class="k-button k-button-icontext k-grid-delete" href="\\#"><span class="k-icon k-delete"></span>Delete</a>'

        }
        ],
        columns: [
            { field: "ID", title: "ID" },
            { field: "Name", title: "Имя"},
            { field: "Number", title: "Номер" },
            { field: "Status", title: "Статус" },
            { template: '<input type="checkbox" class="chkbx" />', width: 40 },
            { command: ["edit"], title: " ", width: "250px" }],
        editable: "popup"
    });



    $(".k-grid-delete").click(function () {
        var grid = $("#grid").data("kendoGrid");
        var arrOfCheckedCheckboxes = new Array();

        // put all checked rows ID in to an array
        $("#grid")
            .find("input:checked")
            .each(function () {
                var rowId = grid.dataItem($(this).closest('tr')).ID;
                arrOfCheckedCheckboxes.push(rowId);

            });

         //pass array to controller
        $.ajax({
            type: "POST",
            url: "/api/Grid/DestroyContacts",
            data: JSON.stringify(arrOfCheckedCheckboxes),
            dataType: "json",
            contentType: 'application/json; charset=utf-8',

            success: function(result) {


            var grid = $("#grid").data("kendoGrid");
            grid.dataSource.read();


            }

        });



    });

});

 

C# controller:

namespace taskColoredGrid.Controllers

{

    public class GridController : ApiController

    {

         [HttpPost]

        public HttpResponseMessage CreateContacts([FromBody] Contacts contacts)

        {

 

            return Request.CreateResponse(HttpStatusCode.OK);

        }

  }

}

 

C# model:

namespace taskColoredGrid.Models

{

    public class Contacts

    {

        public int ID { get; set; }

        public string Name { get; set; }

        public int Number { get; set; }

        public string Status { get; set; }

        public string Discontinued { get; set; }

    }

}

PrintScreen of data I'm receiving in controller in attachment:

 

[Daniel]

Hello,

The data will not be bound with the code that you provided because the batch option is enabled. In this case the dataSource by default will sent a collection named models and not a single record. Disabling the batch option should fix the problem.
Also, if you wish to post the data as JSON then you should set the contentType and use the parameterMap function to serialize the data as JSON:

transport: {
   read: {
       url: crudServiceBaseUrl + "GetContacts",
       dataType: "json"
   },
   create: {
       url: crudServiceBaseUrl + "CreateContacts",
       type: "POST",
       dataType: "json",
       contentType: "application/json; charset=utf-8"
   },
   parameterMap: function (data, type) {
       if (type !== "read") {
           return kendo.stringify(data);
       }
   }
}

Regards,
Daniel
Telerik by Progress