Not able to load data for level 1

[nitinayir8Participant]

Hi Team,

We are not able to load data for level 1 children of treeGrid. Currently we are using virtual mode treeGrid and trying to load data from server file (getTaskDetails.php).
When we try to load data for level 1 using on demand method, we get ‘too much recursion’ jquery error. can you please refer fiddle recursion issue

Note: insert below php script in getTaskDetails.php file
header(‘Content-Type: application/json’);
if(!empty($_POST[‘expandedRecord’])){
if($_POST[‘expandedRecord’][‘level’] == 0){
echo ‘{“id”: “123457”, “duration”: “7”, “firstname”:”Guylene”, “lastname”: “Murphy”, “name”: “Guylene Murphy”, “task”: “Housewares”}’;
}else if($_POST[‘expandedRecord’][‘level’] == 1){
echo ‘{“id”: “123458”, “duration”: “8”, “firstname”:”Andrew”, “lastname”: “Fuller”, “name”: “Andrew Fuller”, “task”: “Kitchen supplies”}’;
}
}else{
echo ‘{“id”: “123456”, “duration”: “7”, “firstname”:”Guylene”, “lastname”: “Murphy”, “name”: “Guylene Murphy”, “task”: “Housewares”}’;
}
exit;

[Peter StoevKeymaster]

Hi nitinayir8,

I’d suggest you to see our virtual mode demos and see what you do and what you do not do like in the demo. The fiddle which you send me will not work because you try to access data from another domain and as it’s cross domain call this will not work.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com/

[nitinayir8Participant]

Hi Peter,

Actually i have checked virtual mode demos and same example i had used to build tree grid children. But wehn i make ajax call in generateTasks function to fetch data from server gets ‘too much recursion’ error.

can you pelase provide ajax call working example, so the level 1 data loads for children.

Thanks,

Nitin

[Peter StoevKeymaster]

Hi Nitin,

There are 2 examples. The one is with Ajax calls, the other is with local data. From your post, it seems that you checked only the one with Local data. I would suggest checking the other TreeGrid sample, too.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[nitinayir8Participant]

Hi Peter,

I tried the option which you have told, Please check below snippet:
$(document).ready(function () {
// prepare the data
var source =
{
dataType: “json”,
dataFields: [
{ name: “id”, type: “string” },
{ name: “name”, type: “string” },
{ name: “duration”, type: “number” },
{ name: “task”, type: “number” }
],
timeout: 10000,
type:’POST’,
hierarchy:
{
keyDataField: { name: ‘id’ },
parentDataField: { name: ‘name’ }
},
id: ‘id’,
root: ‘Rows’,
url: “getTaskDetails.php”
};

// create Tree Grid
$(“#treeGrid”).jqxTreeGrid(
{
width:800,
virtualModeCreateRecords: function (expandedRecord, done) {
var dataAdapter = new $.jqx.dataAdapter(source,
{
formatData: function (data) {
if (expandedRecord == null) {
data.$filter = “(ReportsTo eq null)”
}
else {
data.expandedRecord = expandedRecord;
}
return data;
},
loadComplete: function()
{
done(dataAdapter.records);
},
loadError: function (xhr, status, error) {
done(false);
throw new Error(“http://services.odata.org: ” + error.toString());
}
}
);
dataAdapter.dataBind();
},
virtualModeRecordCreating: function (record) {
// record is creating.
},
columns: [
{ text: ‘FirstName’, columnGroup: ‘name’, dataField: ‘firstname’, width: 150 },
{ text: ‘LastName’, columnGroup: ‘name’, dataField: ‘lastname’, width: 150 },
{ text: ‘Duration’, dataField: ‘duration’, width: 200 },
{ text: ‘Task’, dataField: ‘task’}
]
});
});

PHP script:
<?php
header(‘Content-Type: application/json’);
if(!empty($_POST[‘expandedRecord’])){
if($_POST[‘expandedRecord’][‘level’] == 0){
echo ‘{“id”: “123689”, “duration”: “7”, “firstname”:”Guylene”, “lastname”: “Murphy”, “name”: “Guylene Murphy”, “task”: “Housewares”}’;
}else if($_POST[‘expandedRecord’][‘level’] == 1){
echo ‘{“id”: “123856”, “duration”: “8”, “firstname”:”Andrew”, “lastname”: “Fuller”, “name”: “Andrew Fuller”, “task”: “Kitchen supplies”}’;
}
}else{
echo ‘[{“id”: “123456”, “duration”: “7”, “firstname”:”Guylene”, “lastname”: “Murphy”, “name”: “Guylene Murphy”, “task”: “Housewares”}, {“id”: “123457”, “duration”: “7”, “firstname”:”Guylene”, “lastname”: “Murphy”, “name”: “Guylene Murphy”, “task”: “Housewares”}, {“id”: “123458”, “duration”: “7”, “firstname”:”Guylene”, “lastname”: “Murphy”, “name”: “Guylene Murphy”, “task”: “Housewares”}, {“id”: “123459”, “duration”: “7”, “firstname”:”Guylene”, “lastname”: “Murphy”, “name”: “Guylene Murphy”, “task”: “Housewares”}, {“id”: “123460”, “duration”: “7”, “firstname”:”Guylene”, “lastname”: “Murphy”, “name”: “Guylene Murphy”, “task”: “Housewares”}, {“id”: “123461”, “duration”: “7”, “firstname”:”Guylene”, “lastname”: “Murphy”, “name”: “Guylene Murphy”, “task”: “Housewares”}, {“id”: “123462”, “duration”: “7”, “firstname”:”Guylene”, “lastname”: “Murphy”, “name”: “Guylene Murphy”, “task”: “Housewares”}, {“id”: “123463”, “duration”: “7”, “firstname”:”Guylene”, “lastname”: “Murphy”, “name”: “Guylene Murphy”, “task”: “Housewares”}, {“id”: “123464”, “duration”: “7”, “firstname”:”Guylene”, “lastname”: “Murphy”, “name”: “Guylene Murphy”, “task”: “Housewares”}, {“id”: “123465”, “duration”: “7”, “firstname”:”Guylene”, “lastname”: “Murphy”, “name”: “Guylene Murphy”, “task”: “Housewares”}, {“id”: “123466”, “duration”: “7”, “firstname”:”Guylene”, “lastname”: “Murphy”, “name”: “Guylene Murphy”, “task”: “Housewares”}, {“id”: “123467”, “duration”: “7”, “firstname”:”Guylene”, “lastname”: “Murphy”, “name”: “Guylene Murphy”, “task”: “Housewares”}, {“id”: “123468”, “duration”: “7”, “firstname”:”Guylene”, “lastname”: “Murphy”, “name”: “Guylene Murphy”, “task”: “Housewares”}, {“id”: “123469”, “duration”: “7”, “firstname”:”Guylene”, “lastname”: “Murphy”, “name”: “Guylene Murphy”, “task”: “Housewares”}, {“id”: “123470”, “duration”: “7”, “firstname”:”Guylene”, “lastname”: “Murphy”, “name”: “Guylene Murphy”, “task”: “Housewares”}, {“id”: “123471”, “duration”: “7”, “firstname”:”Guylene”, “lastname”: “Murphy”, “name”: “Guylene Murphy”, “task”: “Housewares”}, {“id”: “123472”, “duration”: “7”, “firstname”:”Guylene”, “lastname”: “Murphy”, “name”: “Guylene Murphy”, “task”: “Housewares”}, {“id”: “123473”, “duration”: “7”, “firstname”:”Guylene”, “lastname”: “Murphy”, “name”: “Guylene Murphy”, “task”: “Housewares”}, {“id”: “123474”, “duration”: “7”, “firstname”:”Guylene”, “lastname”: “Murphy”, “name”: “Guylene Murphy”, “task”: “Housewares”}, {“id”: “123475”, “duration”: “7”, “firstname”:”Guylene”, “lastname”: “Murphy”, “name”: “Guylene Murphy”, “task”: “Housewares”}]’;
}
exit;
?>

Still i get the same issue ‘too much recursion’, when i click on level 1 children.

[nitinayir8Participant]

Hi Peter,

The example which you have shown doesn’t make ajax call on demand instead of it loads data initially. Please check the console On demand example.
We need a feature which will make ajax call level wise and load ajax content on demand.

Thanks,
Nitin

[Peter StoevKeymaster]

AJAX sample with TreeGrid is available in the demos.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[nitinayir8Participant]

Hi Peter,

Can you please tell the example name from demos, so we can refer.

Thanks,
Nitin

[Peter StoevKeymaster]

http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxtreegrid/javascript-tree-grid-load-on-demand.htm?light

[Author]

Posts