Kendo - KnockOut Grid Bind

<link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />

<link href="@Url.Content("~/Content/kendo.common.min.css")" rel="stylesheet" type="text/css" />

<link href="@Url.Content("~/Content/kendo.blueopal.min.css")" rel="stylesheet" type="text/css" />

<script src="@Url.Content("~/Scripts/jquery-1.8.3.js")" type="text/javascript"></script>

<script src="../../Scripts/knockout-2.2.0.debug.js" type="text/javascript"></script>

<script src="../../Scripts/kendo.all.min.js" type="text/javascript"></script>

<script src="../../Scripts/knockout-kendo.min.js" type="text/javascript"></script>

HTML

                                              

<div data-bind='kendoGrid:gridConfig'></div>  

                                               

JavaScript

<script language="javascript" type="text/javascript">

$(document).ready(function () {

      

        $.ajaxSetup({ async: false });

        //var Data= [{ "ShipCity": "Kolkata", "ShipName": "Pinaki GROUP" }, { "ShipCity": "Mumbai", "ShipName": "Pinaki SOL"}];

        var Data = null;

        function DataFunction() {

            $.post("/BkCode/BookResult", null, function (d) {

                Data = d;

            });

            return Data;

        }

      

        var ViewModel = function () {

            this.gridConfig = {

                data: null,

                dataSource: {

                    type: "odata",

                    data: DataFunction(), //This is use to access data from database using jQuery

                                          //   and return data in Json format

                    //data: Data,

                    schema: {

                        model: {

                            fields: {

                                ShipCity: {

                                    type: "string"

                                   

                                },

                                ShipName: {

                                    type: "string"

                                }

                            }

                        }

                    },

                    pageSize: 10 //,

                    //serverPaging: true,

                    //serverFiltering: true,

                    //serverSorting: true

                },

                columns: [{

                    field: "ShipCity",

                    title: "Id",

                    filterable: false

                },

                {

                    field: "ShipName",

                    title: "Company Name",

                    filterable: true

                },

                {

                    command: ["edit", "destroy"],

                    filterable: false

                }] ,

                height: 550,

                scrollable: false,

                pageable: true,

                sortable: true,

                groupable: true,

                filterable: true,

                editable: "inline", //popup

                save: function () {

                    this.refresh();

                }

            };

        };

        ko.applyBindings(new ViewModel());

    })

</script>

C#

public JsonResult BookResult()

        {

            var result = from s in bk.GetPrmCompanies()

                         select new book{

                             ShipCity = s.Id,

                             ShipName = s.CoNames

                         };

            DB.Configuration.ProxyCreationEnabled = false;

            return Json(result, JsonRequestBehavior.AllowGet); //Content(sd, "text/xml");

        }