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

Query on Grid Paging

5 Answers 403 Views

Grid

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

Sanket asked on 20 Jan 2016, 05:40 PM

I am trying Grid paging feature with WebAPI and Below is my code sample-

HTML page-

<div id="example">
        <div id="grid"></div>
        <script>
            $(document).ready(function () {
                $("#grid").kendoGrid({
                    dataSource: {
                        //type: "odata",
                        serverPaging: true,
                        serverSorting: true,
                        pageSize: 5,
                        transport: {
                            read: "api/Audit"
                        }
                    },
                    height: 643,
                    pageable: true,
                    scrollable: {
                        virtual: false
                    },
                    sortable: true,
                    dataBound: function(e) {
                        console.log("dataBound");
                    },

                    columns: [
                                    { field: "AUDIT_ID", title: "AUDIT_ID" },
                                    { field: "AUDIT_TYPE", title: "AUDIT_TYPE" },
                    ]
                });
            });
        </script>
        <style>
            /*horizontal Grid scrollbar should appear if the browser window is shrinked too much*/
            #grid table {
                min-width: 1190px;
            }
        </style>
    </div>

WebAPI Get method – Case 1

public IQueryable<AUDIT> GetAUDIT()
        {
            return db.AUDIT;
        }

WebAPI Get method – Case 2

public IQueryable<AUDIT> GetAUDIT(int take, int skip, int page, int pageSize)
        {
            return db.AUDIT.Take(take * page).OrderBy(x => x.AUDIT_ID).Skip(skip);
        }

In Case 1,
I am receiving all the records irrespective of page size.
Every time, I click on next page, it fetches all records again and shows records from row number 1.

In Case 2,
I am able to show only one page size records and it always remains as Page1. I couldn't see multiple pages
These are my requests
http://localhost:49736/api/Audit?take=5&skip=0&page=1&pageSize=5
http://localhost:49736/api/Audit?take=5&skip=5&page=2&pageSize=5

Could you please help me on this?

Cheers

Sanket

5 Answers, 1 is accepted

answered on 25 Jan 2016, 04:05 AM

For Case 1, setting server paging to false does work for me.

In Case2, as you mentioned I tried changing to this
return db.AUDIT.Take(take * page).OrderBy(x => x.AUDIT_ID).Skip(skip);
but at first instance i get 5 records. If i use scroll then there no subsequent request.

I also tried to increase pageSize from 5 to 50 records. in this case too for first request i get 50 records but there is no further request received by my webAPI. (I have make sure that I am using scrollable: { virtual: false }, and serverPaging: true,)

Do you have any example where Paging and remoate data virtualization is used?

Cheers

Sanket