Support (Feature Explorer and Safari Version 9.0.1 (11601.2.7.2) ),
I need a little guidance on the proper technique for (re-)loading new data in an existing grid.
The following is my observation illustrated in my attached feature explorer example:
1. I am using a clientOnly datasource and calling setCacheData.
2. I am calling fetchData on the grid.
3. It works.
4. If I repeat steps 1 and 2, it does not work.
Therefore, I tried subsequent loads using invalidate instead of fetchData, which seems to work, but may not be proper use.
Questions:
1. Is the loading technique different when loading the first time versus subsequent times?
2. What is the correct use of the framework on this topic?
3. In my test case, it gets worse if a filter criteria is present. What is the correct use when criteria may or may not be present?
4. In my example, dataArrived seems to not be called for the initial load and therefore, the tree does not expand. What is the correct technique for always expanding?
Thank you in advance,
Mitch.
PASTE THIS IN FEATURE EXPLORER
==============================[/FONT]
var myData1 = [
{ EmployeeId:"4", ReportsTo:"1", Name:"Charles Madigen 1" },
{ EmployeeId:"188", ReportsTo:"4", Name:"Rogine Leger 1" },
{ EmployeeId:"189", ReportsTo:"4", Name:"Gene Porter 1" },
{ EmployeeId:"265", ReportsTo:"189", Name:"Olivier Doucet 1" },
{ EmployeeId:"264", ReportsTo:"189", Name:"Cheryl Pearson 1" }
];
var myData2 = [
{ EmployeeId:"4", ReportsTo:"1", Name:"Charles Madigen 2" },
{ EmployeeId:"188", ReportsTo:"4", Name:"Rogine Leger 2" },
{ EmployeeId:"189", ReportsTo:"4", Name:"Gene Porter 2" },
{ EmployeeId:"265", ReportsTo:"189", Name:"Olivier Doucet 2" },
{ EmployeeId:"264", ReportsTo:"189", Name:"Cheryl Pearson 2" }
];
var myData3 = [
{ EmployeeId:"4", ReportsTo:"1", Name:"Charles Madigen 3" },
{ EmployeeId:"188", ReportsTo:"4", Name:"Rogine Leger 3" },
{ EmployeeId:"189", ReportsTo:"4", Name:"Gene Porter 3" },
{ EmployeeId:"265", ReportsTo:"189", Name:"Olivier Doucet 3" },
{ EmployeeId:"264", ReportsTo:"189", Name:"Cheryl Pearson 3" }
];
var myData4 = [
{ EmployeeId:"4", ReportsTo:"1", Name:"Charles Madigen 4" },
{ EmployeeId:"188", ReportsTo:"4", Name:"Rogine Leger 4" },
{ EmployeeId:"189", ReportsTo:"4", Name:"Gene Porter 4" },
{ EmployeeId:"265", ReportsTo:"189", Name:"Olivier Doucet 4" },
{ EmployeeId:"264", ReportsTo:"189", Name:"Cheryl Pearson 4" }
];
isc.setAutoDraw( false );
var buttons = isc.HLayout.create({
height:30,
members:[
isc.Button.create({
width: "*",
title: "#1 - Set data 1 and fetch",
click: function() {
MyTree.dataSource.setCacheData( myData1 );
MyTree.fetchData();
}
}),
isc.Button.create({
width: "*",
title: "#2 - Set data 2 and fetch",
click: function() {
MyTree.dataSource.setCacheData( myData2 );
MyTree.fetchData();
}
}),
isc.Button.create({
width: "*",
title: "#3 - Set data 3 and Invalidate",
click: function() {
MyTree.dataSource.setCacheData( myData3 );
MyTree.invalidateCache();
}
}),
isc.Button.create({
width: "*",
title: "#4 - Set data 4 and Invalidate",
click: function() {
MyTree.dataSource.setCacheData( myData4 );
MyTree.invalidateCache();
}
})
]
});
var tree = isc.TreeGrid.create({
ID: "MyTree",
autoFetchData: false,
dataFetchMode: "local",
loadDataOnDemand: false,
showFilterEditor: true,
filterOnKeypress: true,
filterLocalData: true,
keepParentsOnFilter: true,
initWidget: function(arguments) {
this.Super( "initWidget", arguments);
this.dataSource = isc.DataSource.create( {
clientOnly: true,
fields: [
{ name: "Name" },
{ name: "EmployeeId", primaryKey:true },
{ name: "ReportsTo", foreignKey:"EmployeeId" }
]
});
},
dataProperties:{
dataArrived:function (parentNode) {
this.openAll();
}
},
fields: [
{ name: "Name", canFilter:true }
]
});
isc.VLayout.create({
autoDraw:true, width:"100%", height:"100%",
members:[ buttons, tree ]
});
I need a little guidance on the proper technique for (re-)loading new data in an existing grid.
The following is my observation illustrated in my attached feature explorer example:
1. I am using a clientOnly datasource and calling setCacheData.
2. I am calling fetchData on the grid.
3. It works.
4. If I repeat steps 1 and 2, it does not work.
Therefore, I tried subsequent loads using invalidate instead of fetchData, which seems to work, but may not be proper use.
Questions:
1. Is the loading technique different when loading the first time versus subsequent times?
2. What is the correct use of the framework on this topic?
3. In my test case, it gets worse if a filter criteria is present. What is the correct use when criteria may or may not be present?
4. In my example, dataArrived seems to not be called for the initial load and therefore, the tree does not expand. What is the correct technique for always expanding?
Thank you in advance,
Mitch.
PASTE THIS IN FEATURE EXPLORER
==============================[/FONT]
var myData1 = [
{ EmployeeId:"4", ReportsTo:"1", Name:"Charles Madigen 1" },
{ EmployeeId:"188", ReportsTo:"4", Name:"Rogine Leger 1" },
{ EmployeeId:"189", ReportsTo:"4", Name:"Gene Porter 1" },
{ EmployeeId:"265", ReportsTo:"189", Name:"Olivier Doucet 1" },
{ EmployeeId:"264", ReportsTo:"189", Name:"Cheryl Pearson 1" }
];
var myData2 = [
{ EmployeeId:"4", ReportsTo:"1", Name:"Charles Madigen 2" },
{ EmployeeId:"188", ReportsTo:"4", Name:"Rogine Leger 2" },
{ EmployeeId:"189", ReportsTo:"4", Name:"Gene Porter 2" },
{ EmployeeId:"265", ReportsTo:"189", Name:"Olivier Doucet 2" },
{ EmployeeId:"264", ReportsTo:"189", Name:"Cheryl Pearson 2" }
];
var myData3 = [
{ EmployeeId:"4", ReportsTo:"1", Name:"Charles Madigen 3" },
{ EmployeeId:"188", ReportsTo:"4", Name:"Rogine Leger 3" },
{ EmployeeId:"189", ReportsTo:"4", Name:"Gene Porter 3" },
{ EmployeeId:"265", ReportsTo:"189", Name:"Olivier Doucet 3" },
{ EmployeeId:"264", ReportsTo:"189", Name:"Cheryl Pearson 3" }
];
var myData4 = [
{ EmployeeId:"4", ReportsTo:"1", Name:"Charles Madigen 4" },
{ EmployeeId:"188", ReportsTo:"4", Name:"Rogine Leger 4" },
{ EmployeeId:"189", ReportsTo:"4", Name:"Gene Porter 4" },
{ EmployeeId:"265", ReportsTo:"189", Name:"Olivier Doucet 4" },
{ EmployeeId:"264", ReportsTo:"189", Name:"Cheryl Pearson 4" }
];
isc.setAutoDraw( false );
var buttons = isc.HLayout.create({
height:30,
members:[
isc.Button.create({
width: "*",
title: "#1 - Set data 1 and fetch",
click: function() {
MyTree.dataSource.setCacheData( myData1 );
MyTree.fetchData();
}
}),
isc.Button.create({
width: "*",
title: "#2 - Set data 2 and fetch",
click: function() {
MyTree.dataSource.setCacheData( myData2 );
MyTree.fetchData();
}
}),
isc.Button.create({
width: "*",
title: "#3 - Set data 3 and Invalidate",
click: function() {
MyTree.dataSource.setCacheData( myData3 );
MyTree.invalidateCache();
}
}),
isc.Button.create({
width: "*",
title: "#4 - Set data 4 and Invalidate",
click: function() {
MyTree.dataSource.setCacheData( myData4 );
MyTree.invalidateCache();
}
})
]
});
var tree = isc.TreeGrid.create({
ID: "MyTree",
autoFetchData: false,
dataFetchMode: "local",
loadDataOnDemand: false,
showFilterEditor: true,
filterOnKeypress: true,
filterLocalData: true,
keepParentsOnFilter: true,
initWidget: function(arguments) {
this.Super( "initWidget", arguments);
this.dataSource = isc.DataSource.create( {
clientOnly: true,
fields: [
{ name: "Name" },
{ name: "EmployeeId", primaryKey:true },
{ name: "ReportsTo", foreignKey:"EmployeeId" }
]
});
},
dataProperties:{
dataArrived:function (parentNode) {
this.openAll();
}
},
fields: [
{ name: "Name", canFilter:true }
]
});
isc.VLayout.create({
autoDraw:true, width:"100%", height:"100%",
members:[ buttons, tree ]
});
Comment