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

Kendo Grid display items issue

1 Answer 238 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Steve
Top achievements
Rank 1
Steve asked on 06 Jan 2016, 10:04 PM

Hi All,

 In my grid, I have the following script

 
myGridData.ds = new kendo.data.DataSource({
               transport: {
                read: function(options) {
                    var myData = [];
                    var myGrid = $("#grid").data("kendoGrid");
                    var pageSize = myGrid.dataSource.pageSize();
                    var currentPage = myGrid.dataSource.page();

                    var totalRtn = 0;

                    CallController(false, '/main/LoadData?from=' + $("#dateFrom").val() + '&to=' + $("#dateTo").val() + '&pageNumber=' + currentPage + '&pageSize=' + gridPageSize,
                        function(result) {
                            for (var i = 0; i < result.length; i++) {
                                        ...other code goes here...
                                    };

                                    totalRtn= result.length
                                };
                            };
                        });

                    options.success(myData);
                }
            },
            serverPaging: true,
            schema: {
                model: {
                    id: "Id",
                    fields: {
                        ...fields info goes here...
                    }
                },

                 total: "totalRtn" // using this will give to "No items to display" and removing it will give me the attach screen shot.
            },
            pageSize: 500    //initial setting 
        });

 var grid = $("#grid").kendoGrid({
            dataSource: myGridData.ds,
            scrollable: true,
            columnMenu: true,
            groupable: true,
            sortable: true,
            resizable: true,
            reorderable: true,
            filterable: true,
            pageable: {
                refresh: true,
                buttonCount: 5,
                pageSizes: [200, 500, 1000, 5000, 10000]
            },
            columns: [
            {
                field: 'xxxx',
                title: 'yyyy',
            }, etc...

            ]

The problem that I'm facing is whenever I changed the 'items to page' to display; the total items is the same as my pageSize.  If I hard code the pageSize to max value (10000) it will be fine, but wouldn't that beat the purpose of having the serverPaging set to true.  Any help is appreciated or provide some explanation of how I could achieve this issue?

TIA

1 Answer, 1 is accepted

Sort by
0
Nikolay Rusev
Telerik team
answered on 11 Jan 2016, 08:00 AM

Hello Steve,

 

Setting serverPaging: true means that you are responsible for returning only pageSize items from the read method. Also the response must return the total item count, otherwise the length of current data items will be used.

 

Example - http://dojo.telerik.com/@rusev/UsAbA

 

Regards,
Nikolay Rusev
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
Steve
Top achievements
Rank 1
Answers by
Nikolay Rusev
Telerik team
Share this question
or