extjs Dynamically load nodes on scroll down - extjs4.1

Question

I am new to Ext Js 4.1, I have 5000 child nodes and need to load only 50 nodes on load,after scrolling down have to load another 50 nodes and continues. I am trying from past 2 days with different scenarios, but I didn't find anything related, can anu one please help me how to do, if possible with sample code.
Thanks in Advance

Answer 1

The only way to do this with a server that gives you your's 5000 child nodes is to use a buffered store.
Using a buffered store you can set your page dimensions and scrolling down changing the page you will be able to load your datas 50 by 50 records.
check all you need here http://docs.sencha.com/extjs/5.1/5.1.2-apidocs/#!/api/Ext.data.BufferedStore
buffered store disponible also on ext 4.1
also some examples on sencha examples
you can watch this
http://dev.sencha.com/deploy/ext-4.0.0/examples/grid/infinite-scroll.html

Answer 2

Finally i find the solution that we need to use 'bufferedrenderer' Plugin.Infinite grid uses a buffered store, and is not supported for trees.
Here is the sample code
Ext.onReady(function () {
var store = Ext.create('Ext.data.TreeStore', {
proxy: {
type: 'ajax',
url: 'http://localhost/codig/index.php/user/jsonusers',
extraParams:limitValue
}
});
store.reload();
var treePanel = Ext.create('Ext.tree.Panel', {
id:'mytree',
title: 'Infinite nodes tree',
width: 200,
height: 400,
store: store,
rootVisible: false,
plugins: {
ptype: 'bufferedrenderer'
},
renderTo: Ext.getBody()
});
});