jqxtree grid not loading large XML dataset

[nageenapParticipant]

Hi,

I am having problem in loading large xml dataset into the tree grid. The widget works fine when I try to load 2 records but when I try to load 3 records, it goes into infinite waiting time and says, “loading”. Please help me with your suggestions. Below is my implementation:

XML Sample with 3 records:

<XMLData>
<RootXml migrationplanId=”2012-07-31″>
<appCount>1</appCount>
<XMLData>
<RootXml migrationplanId=”Enterprise Technology BG (EY)”>
<businessgroup>Enterprise Technology BG (EY)</businessgroup>
<appCount>1</appCount>
<migrationplandate>2012-07-31</migrationplandate>
<XMLData>
<RootXml migrationplanId=”Corporate Technology Group (FVS)”>
<businessunit>Corporate Technology Group (FVS)</businessunit>
<appCount>1</appCount>
<migrationplandate>2012-07-31</migrationplandate>
</RootXml>
</XMLData>
</RootXml>
</XMLData>
</RootXml>
<RootXml migrationplanId=”2012-09-02″>
<appCount>1</appCount>
<XMLData>
<RootXml migrationplanId=”Personal Investing (PI)”>
<businessgroup>Personal Investing (PI)</businessgroup>
<appCount>1</appCount>
<migrationplandate>2012-09-02</migrationplandate>
<XMLData>
<RootXml migrationplanId=”PI Technology BU (PIY)”>
<businessunit>PI Technology BU (PIY)</businessunit>
<appCount>1</appCount>
<migrationplandate>2012-09-02</migrationplandate>
</RootXml>
</XMLData>
</RootXml>
</XMLData>
</RootXml>
<RootXml migrationplanId=”2012-12-04″>
<appCount>2</appCount>
<XMLData>
<RootXml migrationplanId=”Enterprise Technology BG (EY)”>
<businessgroup>Enterprise Technology BG (EY)</businessgroup>
<appCount>2</appCount>
<migrationplandate>2012-12-04</migrationplandate>
<XMLData>
<RootXml migrationplanId=”Corporate Technology Group (FVS)”>
<businessunit>Corporate Technology Group (FVS)</businessunit>
<appCount>2</appCount>
<migrationplandate>2012-12-04</migrationplandate>
</RootXml>
</XMLData>
</RootXml>
</XMLData>
</RootXml>
</XMLData>

.JSP file:

var source =
{
dataType: “xml”,
dataFields: [
{ name: ‘migrationplandate’, type:’string’},
{ name: ‘migrationplanId’, type:’string’},
{ name: ‘appCount’, type:’number’ },
{ name: ‘businessgroup’,type:’string’},
{ name: ‘businessunit’, type:’string’ },

],
hierarchy:
{
// defines the root and record of each hiearchy level.
// keyDataField: { name: ‘migrationplanId’ },
// parentDataField: { name: ‘migrationplandate’ }
root: ‘XMLData’,
record: ‘RootXml’
},
id: ‘migrationplanId’,
root: ‘XMLData’,
record: ‘RootXml’,
async: true,
url: ‘/MigrationWave/dataLoadInitiatorJson?’+paramArray

};
// console.log(source);
var dataAdapter = new $.jqx.dataAdapter(source);
// dataAdapter.dataBind();

// create Tree Grid
$(“#treeGrid”).jqxTreeGrid(
{
width: 400,
checkboxes: true,
hierarchicalCheckboxes: true,
source: dataAdapter,
pageable:true,
pagerMode: ‘default’,
pageSizeMode: ‘root’,
pageSize: 20,
columnsResize: true,
sortable: true,
altRows:true,
theme: ‘energyblue’,

columns: [
{ text: ‘Migration Plan Date’,dataField: ‘migrationplanId’, columnGroup: “Group”, width: 300, renderer: columnsrenderer },
{ text: ‘App Count’,dataField: ‘appCount’,columnGroup: “Group”,width: 100, renderer: columnsrenderer }
],

});

[jqwidgetsdevParticipant]

Virtual Mode
http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxtreegrid/index.htm#demos/jqxtreegrid/javascript-tree-grid-load-on-demand.htm
http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxtreegrid/index.htm#demos/jqxtreegrid/javascript-tree-grid-virtual-mode.htm

[nageenapParticipant]

forgot to mention, this is a nested XML data..

[VladimirParticipant]

Hello nageenap,

The problem is that your third element, has duplicate ID fields with the first element set, so the library throws an error when trying to create the element hierarchy. Your ID fields need to be unique as they are used to create the tree hierarchy.
Here is a fiddle with fixed id fields:

Best Regards,
Vladimir

jQWidgets Team
http://www.jqwidgets.com

[Author]

Posts