I have a treeList which use remote binding, meaning the nodes use lazy loading. Rarely, It happens that I need to process all nodes (client side).
Is there a way to load all nodes at once ?
Example of lazy loading : link
Related
As you can see in the picture this is a kendo grid that gets the data from the database and do the sorting, paging and grouping and right now it has been grouped by. My record are a lot, they're more than 2-3 millions and because of this reason I can not send all my data to the grid so first the I send a request to database and then I receive the paged, sorted and group by response back from the server and everything works great but sometimes there might be only 2 set of grouped data but inside these two there might be millions of data so this is what I did, I just show the name of the groups with no child data. My problem is that when someone clicks on a group, I want to open up it's nodes and show the related data. but I didn't find any method in kendo to show the nodes' data that is present inside a datasource in its related node.
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.
I'm currently facing a situation where I need to destroy a jqGrid that holds a large number of rows before creating a new set of DOM elements. I've tried using jqGrid's GridDestroy method, but it is still leaving a large number of detached DOM nodes so I thought I might be doing it incorrectly.
Here is my current process that is still leaving detached DOM nodes:
$(deleteButton).click(function () {
$('#grid').jqGrid("clearGridData");
$('#grid').jqGrid('GridDestroy');
$('#grid').remove();
$('#gridContainer').empty();
});
I felt like this process was overkill, but it is still resulting in detached DOM nodes. I've set up an example in jsFiddle (http://jsfiddle.net/8DYD8/1/).
Steps to reproduce:
Click the create button to create the jqGrid
Click the delete button
Take a heap snapshot using Chrome's debugger->Profiles tab, and you should see numerous detached DOM nodes in the snapshot
According to jqgrid expert #oleg:
The method GridDestroy works like jQuery.remove. It deletes all
elements which belong to the grid inclusve the element.
The method GridUnload on the other hand delete all, but the empty
element stay on the page. So you are able to create new grid
on the same place.
According to the jqGrid wiki:
http://www.trirand.com/jqgridwiki/doku.php?id=wiki:methods
GridDestroy is what you need:
Destroys the entry grid with id= grid_id from the DOM (clears all the
html associated with the grid and unbinds all events)
The base problem is I have a TreeGrid that I has a significant number of nodes (over 6k) and I want to be able to load a branch when the user expands a node rather than loading all at once.
I know this is possible in jqGrid (the documentation indicates so just very poorly worded http://www.trirand.com/jqgridwiki/doku.php?id=wiki:adjacency_model ) but what I can't figure out is the precise set of jqGrid settings I need to make it do that.
I do have a functional TreeGrid that will load all records from the 'url' parameter, so the only trick I need is for it to only load the top node alone, and then load it's children when I click the ExpandRow.
Figured it out myself:
The first key is setting loaded=false in the child nodes I don't want loaded. Then I need to respond the request jqGrid sends on unloaded nodes with the right nodes.
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