Binding JSON data with Grid

[Waseem]

Hi,
I am trying to bind JSON data with KENDO grid but can't figure out how to do it. following is the snippet of my code

            <script type="text/javascript">
                $(document).ready(function () {
                    $("#grid").kendoGrid({

                        height: 360,  groupable: true, scrollable: true, sortable: true, pageable: true,

                        columns: [{field: "name",title: "Name"},{field: "number",title: "Number"},{field: "type",title: "Type"},
                                        {field: "low",title: "Low"},{field: "high",title: "High"},{field: "status",title: "Status"}],

                        dataSource: {
                            transport: {
                                read: {
                                        // the remote service url
                                    url: "/DomainService/KendoDomainService.svc/json/GetSpt_values",
                                        // JSONP is required for cross-domain AJAX
                                    dataType: "jsonp"}}},

                                    schema: {
                                        // the data which the data source will be bound to is in the "results" field       
                                        //data: "GetSpt_valuesResult"
                                    }});});

            </script>

When i run above URL in my browser, i get data from json. So, i have data and i have the kendo grid. The data i am fetching from the MasterDB (SQL SERVER) SPT_VALUES table.

the data snippet is as follow:

{"GetSpt_valuesResult":{"TotalCount":2506,"RootResults":
[{"high":null,"low":null,"name":"rpc","number":1,"status":0,"type":"A "},
{"high":null,"low":null,"name":"pub","number":2,"status":0,"type":"A "},
{"high":null,"low":null,"name":"sub","number":4,"status":0,"type":"A "},
{"high":null,"low":null,"name":"dist","number":8,"status":0,"type":"A "}
]}}

Could you please help my in binding data as i am really new to the jquery.

Kind Regards,
waseem

[Waseem]

Hi,
I uploaded this post 2 days ago and still no reply from anyone.
Could please anyone from telerik help me to resolve my problem.

Thanks!

[George]

Try to get rid of

{"TotalCount":2506} from the json query..and define a method in the schema to perform the total count.

or 

move it to the back..
,{"TotalCount":2506}}

This total count is also giving me alot of problem so I excluded it completely.

[Waseem]

Thanks George,

My initial problem was binding json data with the kendo grid, that i have sorted out now by adding data tag in schema and directing it to the path of json data i-e data: "GetSpt_valuesResult.RootResults".
Now, there is another problem of paging, it doesn't show any paging until i don't click on any of the column header (sort). As you have mentioned of TotalCount in your post, i tried to passing TotalCount to the total as kendo forums mentioned but in this way it shows paging first time on load but when i click on to any other page it says "Unable to get value of the property 'TotalCount':ibhect is null or undefined".
here is the code snipet
schema:
{
 data: "GetSpt_valuesResult.RootResults",
        totalNoOfRecords: "GetSpt_valuesResult.TotalCount",
        total: function (totalNoOfRecords) { return totalNoOfRecords.GetSpt_valuesResult.TotalCount; }
},

any idea?

Kind Regards,
Waseem

[Waseem]

Hi George,
I also have got pager working. Here's the code sniped
schema:
{
 data: "GetSpt_valuesResult.RootResults",
 total: function (data) {
  if (data.GetSpt_valuesResult !== undefined)
   return data.GetSpt_valuesResult.TotalCount;
    else return data.PageSize || data.length || 0; }
}
Now, my pager is working fine (on load and also on post backs).

Regards,
Waseem