[Solved] Kendo UI Grid databinding

[Afandi]

Hai,

 I having problem with databinding on kendo UI grid. I'm using Webservice.asmx to request data. I follow step same like this like :

https://github.com/telerik/kendo-examples-asp-net/blob/master/grid-web-service-crud/Default.aspx

I'm also attach my code here.

​

$("#grid").kendoGrid({
               height: 400,
               columns: [
                   { title: "UserID", field: "UserID", width: "100px" },
                   { title: "AccessLevel", field: "AccessLevel", width: "100px" }
               ],
               editable: true, // enable editing
               pageable: true,
               sortable: true,
               filterable: true,
               toolbar: ["create", "save", "cancel"], // specify toolbar commands
               dataSource: {
                   serverSorting: true,
                   serverPaging: true,
                   serverFiltering: true,
                   pageSize: 10,
                   schema: {
                       data: "d.Data", // ASMX services return JSON in the following format { "d": <result> }. Specify how to get the result.
                       total: "d.Total",
                       model: { // define the model of the data source. Required for validation and property types.
                           id: "UserID",
                           fields: {
                               UserID: { editable: false, nullable: true },
                               AccessLevel: { editable: false, nullable: true }
                           }
                       }
                   },
                   batch: true, // enable batch editing - changes will be saved when the user clicks the "Save changes" button
                   transport: {

                       read: {
                           url: "WebService1.asmx/GetUserList", //specify the URL which data should return the records. This is the Read method of the Products.asmx service.
                           contentType: "application/json; charset=utf-8", // tells the web service to serialize JSON
                           datatype: "json",
                           type: "POST" //use HTTP POST request as the default GET is not allowed for ASMX
                       },
                       parameterMap: function (data, operation) {
                           if (operation != "read") {
                               // web service method parameters need to be send as JSON. The Create, Update and Destroy methods have a "products" parameter.
                               return JSON.stringify({ SiteID: '0', UserGroup: 'Administrator', TypeRoot: 'false', SelectedSiteID: '' })
                           } else {
                               // web services need default values for every parameter
                               data = $.extend({ SiteID: '0', UserGroup: 'Administrator', TypeRoot: 'false', SelectedSiteID: '' }, data);
                               return JSON.stringify(data);
                           }

                       }
                   }
               }
           });

Hope some buddy can helping me.

Thank You.

 

 

 

[Rosen]

Hello Afandi,

 

Looking at the provided information, I suspect that the Grid is not populated as the DataSource schema - data/total configuration does not match the actual server response. In the screenshot you have provided the data is located as child of the d field, however, in the schema it is set that it should be into d.Data (also the d.Total is missing). You should correct this by modifying the service to return the data in the format matching the schema.

 

Regards,
Rosen
Telerik