Kendo Grid Gives Multiple Call To remote data when scroll down - kendo-ui

Set server paging true for Kendo Data source
Set Page Size 300 for Kendo Datasource
Set Virtual scroll true for kendo grid
Now make sure in grid has 6000+ records
Scroll down grid to middle (such that you want to see 300 record on 50th page)
If you observe in browser, kendo grid data source call to get records for each page still the 50th page arrived.

Yes it will call for every page if you don't move the scroller fast.
Kendo says following about virtualization : If set to true the grid will always display a single page of data. Scrolling would just change the data which is currently displayed.
There is an existing issue with multiple requests during fast scroll.
If you want to limit performance hit and you don't want to always load 300:
make page size smaller - in this case the virtualization is quite likely going to skip some pages. However this relies at the users skill to scroll fast, if they scroll slow all the pages will be loaded.
implement server side paging via pager and avoid virtualization- this will allow you to control what are you getting from the server.

Related

How to make the next page from continuation of data when using repeater on wix?

I have a website on wix with data connected to repeaters on the page. however my data is too big to show on the same page. How do I break the continuation and start it from the next page.
You can set the number of items to show at once in the dataset settings. Then you can add buttons (and set the click action) or a pagination bar (and connect to the dataset) to page through the items or show more items.

Ag-grid row models: pagination vs virtual paging vs viewport

As title says, I would like to know how to decide which row model to choose and the reason why, depending on how the data change and the number of rows, for example.
Viewport - Use when you need to show realtime data, the server will maintain an open connection to update the grid whenever new data is ready.
Pagination/Virtual Paging - these are both about the same, just depends on what you want for your UI. In both situations you would use them if you have a lot of rows to show, but don't want the user to wait 10 min for the server to respond. Probably works best if you sort/filter on the server side.
Other notes:
In my opinion, if you have pagination, then don't have any scroll. I hate scrolling a table to realize that what I am looking for isn't on that page, then scrolling through another page. The only exception for this is if you have some sorting to your paging, like if the first page was all the A's, or had only from 2000, or just January's data.
Also, Pagination can be used in situations where you don't have a lot of data to request from the server, it could just be a UI preference.

Kendo UI: lazy binding for Kendo grid

Can any one please let me know how can I load first 5000 rows into kendo grid and then load the remaining rows on page selects. I have 50000 rows to load and the page with kendo grid is loading pretty slow. So I want to use lazy loading approach..like loadin gthe first 5000 and then load the next rows in 1000's on page button clicks.
Any help appreciated!
You can either enable virtual scrolling or implement server paging.

jqGrid resize event and the event triggered when page is refreshed

I have a jqGrid in my page and I want to know when does the resize event occur. Will it occur when I refresh the page? If not, what event occurs when the page containing the grid is refreshed. I would like to capture the event to alter it's width when the page is refreshed.
A page refresh causes a postback, so jQuery/jqGrid events aren't really going to detect a refresh so much as the page loading.
Depending on your goals, I would suggest either the jQuery .ready() method or the jqGrid gridComplete() method to handle grid resizing any time someone opens or refreshes the page.
Which one you use will likely depend on whether the actual data that the grid receives is going to influence how large you want to set the grid.
If the data doesn't matter and you just are concerned about the size of the browser window, I would use .ready() and pre-populate your grid configuration with the appropriate size.
If the data does matter, you'll probably want to use the gridComplete method on your jqGrid.
If you want to be able to adapt your grid size when the user resizes the browser, see this answer: Resize jqGrid when browser is resized?

regarding Extjs Grid and preloading?

I am having huge data, to display this I am using grid with paging enabled,
and loading the first page data.
How i can load the next page data in the back ground ??
so that when the user clicks next button I will show the data which is preloaded.
Any work around.
Thanks in advance,
kkchaitu
The simpliest solution could be a loading whole set of data to the store and use Paginating Toolbar for filtering purpose, however you refering that amount of data is "huge" - this could make solution uneffective...
or
Have 3 set of data ready (before - empty at start, actual, and after) and overwrite onload events:
after loading - display and load next, (or previous),
before load check is next (or previous) is avaible - use it, change what is prevoius, actual, next, prepare what should be loaded after (in background)
keep in mind that Ajax requests are asinchronic and clicking could be faster than loading and this should be predicted in logic... However this is just an idea

Resources