This is a migrated thread and some comments may be shown as answers.

KendoUI JQuery with MVC

1 Answer 271 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Santiago
Top achievements
Rank 1
Santiago asked on 16 Jul 2012, 10:09 PM
I know this does not sound smart but im trying to use KendoUI Jquery grid with MVC and the problem is the parameter of the event create, update is empty

    <script type="text/javascript">
        $(document).ready(function () {
 
            var transport = {
                read: {
                    contentType: "application/json; charset=utf-8",
                    type: "POST",
                    dataType: "json",
                    url: "JQueryGrid/Grid_Read"
                },
                update: {
                    url: "JQueryGrid/Grid_Update",
                    contentType: "application/json; charset=utf-8",
                    type: "POST"
                },
                create: {
                    url: "JQueryGrid/Grid_Create",
                    type: "POST"
                },
                destroy: {
                    contentType: "application/json; charset=utf-8",
                    url: "JQueryGrid/Grid_Destroy",
                    type: "POST",
                    dataType: "json"
                },
                parameterMap: function (data, operation) {
                    return kendo.stringify(data);
                }
            };
 
            var dataSource = new kendo.data.DataSource({
                transport: transport,
                batch: true,
                pageSize: 30,
                schema: {
                    model: {
                        id: "PersonalID",
                        fields: {
                            PersonalID: { type: "number", editable: false },
                            FirstName: { type: "string", validation: { required: true} },
                            LastName: { type: "string", validation: { required: true} },
                            DOB: { type: "date" }
                        }
                    }
                }
            });
 
            $("#grid").kendoGrid({
                dataSource: dataSource,
                height: 250,
                filterable: true,
                type: "odata",
                sortable: true,
                pageable: true,
                editable: "inline",
                toolbar: ["create"],
                columns: [
                    {
                        field: "PersonalID",
                        filterable: false,
                        width: 100
                    }, {
                        field: "FirstName",
                        title: "First Name",
                        width: 200
                    }, {
                        field: "LastName",
                        title: "Last Name",
                        width: 200
                    }, {
                        field: "DOB",
                        title: "Date born",
                        width: 100,
                        format: "{0:MM/dd/yyyy}"
                    }, {
                        command: ["edit""destroy"], title: "&nbsp;", width: "210px"
                    }
                ]
            });
        });
    </script>


        public ActionResult Grid_Read()
        {
            var personalDtos = _personalService.GetAllPersonalByFilters(1, string.Empty);
            return Json(personalDtos);
        }
 
        [HttpPost]
        public ActionResult Grid_Update(PersonalDto dto) //<--- comes empty
        {
            var personalDtos = _personalService.GetAllPersonalByFilters(1, string.Empty);
            return Json(personalDtos);
        }
 
        [HttpPost]
        public ActionResult Grid_Create(PersonalDto dto) 
//<--- comes empty
        {             var personalDtos = _personalService.GetAllPersonalByFilters(1, string.Empty);             return Json(personalDtos);         }

1 Answer, 1 is accepted

Sort by
0
Paul Sheridan
Top achievements
Rank 1
answered on 24 Jul 2012, 08:29 AM
2 things..

1. You're using batch editing, this sends the operation as an array (stringified) and not a single item, so 

parameterMap: function (data, operation) {
                    return kendo.stringify(data);
                }

becomes 

parameterMap: function(data, operation) {
                                    if (operation !== "read" && data.models) {
                                        return {items: kendo.stringify(data.models)};
                                    }
                                }

2. you have to deserialize the item server side, so 

[HttpPost]
        public ActionResult Grid_Update(PersonalDto dto) //<--- comes empty
        {
            var personalDtos = _personalService.GetAllPersonalByFilters(1, string.Empty);
            return Json(personalDtos);
        }


becomes something like..

[HttpPost]
        public ActionResult Grid_Update(string dto) 
        {
            var o = JsonConvert.DeserializeObject<PersonalDto>(dto);
            var personalDtos = _personalService.GetAllPersonalByFilters(1, string.Empty);
            return Json(personalDtos);
        }

This is all conditional on the PersonalDto being serializable ofc, you can work that into the object tho.

hope this helps..

Tags
Grid
Asked by
Santiago
Top achievements
Rank 1
Answers by
Paul Sheridan
Top achievements
Rank 1
Share this question
or