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

Grid Javascript: data and total for paging

5 Answers 844 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Paolo
Top achievements
Rank 1
Paolo asked on 20 Nov 2015, 04:44 PM

I am trying to get a grid working with paging.

As far as I understand, grid needs a total count of records and the data in a json array,

The array which is returned by the server call is in this format:

{"total":19,"data":[{"id":"15","user_id":"1","glucose_value":"109","post_prandial":null,"date":"2015-11-14","time":"04:30:00","created_at":"2015-11-14 04:00:00","updated_at":"2015-11-14 04:00:00","notes":"No lantus la sera prima","sys_test_types_id":"100","insulin_types_id":"0","insulin_value":"0","food_types_id":"0"},{"id":"17","user_id":"1","glucose_value":"84","post_prandial":null,"date":"2015-11-14","time":"13:30:00","created_at":"2015-11-14 12:30:28","updated_at":"2015-11-14 12:30:28","notes":"Basale 109. Fatta colazione no insulina","sys_test_types_id":"200","insulin_types_id":"0","insulin_value":"0","food_types_id":"0"},{"id":"19","user_id":"1","glucose_value":"127","post_prandial":null,"date":"2015-11-14","time":"19:30:00","created_at":"2015-11-14 18:28:53","updated_at":"2015-11-14 18:28:53","notes":"Latte di avena un'ora prima. 10 ui per cena","sys_test_types_id":"400","insulin_types_id":"0","insulin_value":"0","food_types_id":"0"},{"id":"21","user_id":"1","glucose_value":"142","post_prandial":null,"date":"2015-11-14","time":"22:00:00","created_at":"2015-11-15 06:04:13","updated_at":"2015-11-15 06:04:13","notes":"No lantus","sys_test_types_id":"500","insulin_types_id":"0","insulin_value":"0","food_types_id":"0"},{"id":"22","user_id":"1","glucose_value":"126","post_prandial":null,"date":"2015-11-15","time":"07:00:00","created_at":"2015-11-15 06:04:41","updated_at":"2015-11-15 06:04:41","notes":"No lantus la sera prima","sys_test_types_id":"100","insulin_types_id":"0","insulin_value":"0","food_types_id":"0"},{"id":"23","user_id":"1","glucose_value":"166","post_prandial":null,"date":"2015-11-15","time":"16:00:00","created_at":"2015-11-15 15:10:25","updated_at":"2015-11-15 15:10:25","notes":"14 UI a pranzo. Pranzo calorico.","sys_test_types_id":"300","insulin_types_id":"0","insulin_value":"0","food_types_id":"0"},{"id":"24","user_id":"1","glucose_value":"79","post_prandial":null,"date":"2015-11-15","time":"19:30:00","created_at":"2015-11-15 18:58:22","updated_at":"2015-11-15 18:58:22","notes":"Zuccheri a merenda","sys_test_types_id":"400","insulin_types_id":"0","insulin_value":"0","food_types_id":"0"},{"id":"25","user_id":"1","glucose_value":"85","post_prandial":null,"date":"2015-11-16","time":"10:30:00","created_at":"2015-11-16 10:07:37","updated_at":"2015-11-16 10:07:37","notes":"","sys_test_types_id":"100","insulin_types_id":"0","insulin_value":"0","food_types_id":"0"},{"id":"30","user_id":"1","glucose_value":"82","post_prandial":null,"date":"2015-11-16","time":"13:00:00","created_at":"2015-11-16 16:48:47","updated_at":"2015-11-16 16:48:47","notes":"Caff\u00e8 a colazione","sys_test_types_id":"200","insulin_types_id":null,"insulin_value":"0","food_types_id":null},{"id":"32","user_id":"1","glucose_value":"115","post_prandial":null,"date":"2015-11-16","time":"17:30:00","created_at":"2015-11-16 16:54:35","updated_at":"2015-11-16 16:54:35","notes":"Niente insulina a pranzo","sys_test_types_id":"300","insulin_types_id":null,"insulin_value":"0","food_types_id":null}]}

 While grid javascript is this:

$(document).ready(function () {
$("#grid").kendoGrid({
dataSource: { type: "json", transport: { read: "/getreportall" , },
schema: { data: "data", field of the response total: "total"
{ fields: { id: {type: "number"},
insulin_value: {type: "number"},
glucose_value: {type: "number"},
date: {type: "date"},
time: {type: "time"},   }
}
},
pageSize: 15,
serverPaging: true,
serverFiltering: true,
serverSorting: true },
height: 550,
filterable: true,
sortable: true,
pageable: true,
columns: [ { field: "date",
title: "Data",
format: "{0:dd/MM/yyyy}" },
{ field: "time",
title: "Ora" },
{ field: "glucose_value",
title: "Glicemia",
filterable: false },
{ field: "insulin_value",
title: "Insulina",
filterable: false },
] });
});

What am I missing to get his code working?

Thanks for your help

Paolo

5 Answers, 1 is accepted

Sort by
0
Viktor Tachev
Telerik team
answered on 23 Nov 2015, 01:15 PM
Hello Paolo,

Please ensure that the fields specified in the dataSource schema correspond to the fields returned from the service.

schema: {
    data: "data",
    total: "total" // total is returned in the "total" field of the response
  }




Regards,
Viktor Tachev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Paolo
Top achievements
Rank 1
answered on 25 Nov 2015, 08:42 PM

Hi Victor,

 the schema returner corresponds, and in fact data are displayed.

I can see the total records with the correct number and the page links.

My problem is that page links in pagination should send parameters to the service that retrieves the data.

take, skip (and maybe pagesize) are needed to the service for knowing the data to send to the grid.

as you can see, in the transport I call getreportall method without passing parameters:

dataSource: { type: "json", transport: { read: "/getreportall" , },

How can I get the take, skip and pagesize parameters from paginator to send them to the service?

Thanks

 

Paolo

0
Paolo
Top achievements
Rank 1
answered on 25 Nov 2015, 09:11 PM

Hi Viktor,

Just to explain better:

I need, from paginator, to make a GET request with take (how many records to take), skip (how many records to skip), and pagesize for passing these parameters to my service that uses them to send the paged data.

0
Paolo
Top achievements
Rank 1
answered on 25 Nov 2015, 09:37 PM

Solved.

I get data in parametermap in the datasource:

dataSource: {
          type: "json",
          contentType: "application/json; charset=utf-8",
          type: "GET",
                  transport: {
                      read: "/getreportall",
                      parameterMap: function (data, type) {
                          if (type == "read") {
                               
                              return {
                                  take: data.take,
                                  skip: data.skip
                              }
                          }
                      }
 
                  },

In this way take and skip are passet to the querystring and I can use them in my server calls.

I found this solution here.

Paolo

0
Viktor Tachev
Telerik team
answered on 26 Nov 2015, 11:44 AM
Hello Paolo,

I am glad that you have found a solution. Thank you for sharing it with the community. This can help someone facing similar issue.

Regards,
Viktor Tachev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
Tags
Grid
Asked by
Paolo
Top achievements
Rank 1
Answers by
Viktor Tachev
Telerik team
Paolo
Top achievements
Rank 1
Share this question
or