I'm trying to put a DynamicForm into the group row of a ListGrid. I'm testing with Smartclient "v9.1p_2015-02-07/Pro Development Only". Starting from one of the Featured Examples, here's my code:
How am I supposed to manage the components when rows are added/removed? Note, the effects I'm describing are independent of whether I'm deleting the last member of a group or not.
1) I would have expected the code above to do what I want, adding new components when new groups are added, and forgetting them when they're removed. With this code however, whenever a row is deleted I lose all my components from the ListGrid. Is that the expected behavior? I guess the groupTree is completely rebuilt from scratch, but the old objects aren't transferred over. If so, then that task would be my responsibility...
2) So if I move the addEmbeddedComponent outside the if/else block, I'd expect to be able to readd the original DynamicForms back into my ListGrid. However, if I do that, I get a long "blink" in the visual when my components disappear and then reappear. That's not very attractive... it looks like two redraws are being scheduled, the first without and the second with my components?
3) The other option of course is to reconstruct and readd my DynamicForms from scratch every time groupStateChanged is called (e.g. add "&& false" to my if statement). There's no "blink". However, I've noticed that redraws are a bit slow.
Between the three options (disappearing, blinking, or slow) I'd probably pick slow... but perhaps I am not understanding something? I realize putting components into group rows isn't a typical usage case, is there an approach I'm supposed to take? There aren't any examples with addEmbeddedComponent.
Code:
isc.ListGrid.create({
ID: "countryList",
width:522, height:224,
alternateRecordStyles:true, cellHeight:22,
dataSource: countryDS,
// display a subset of fields from the datasource
fields:[
{name:"countryName"},
{name:"government"},
{name:"continent"},
],
groupStartOpen:"all",
groupByField: 'continent',
autoFetchData: true,
canRemoveRecords: true,
options:{},
groupStateChanged: function() {
var groups = this.groupTree.getChildren();
var newOptions = {}
for(var r=0; r<groups.length; r++){
var key = groups[r]["groupValue"];
if(key in this.options){
newOptions[key] = this.options[key];
} else {
newOptions[key] = isc.DynamicForm.create({
width:200,
snapTo:"C",
numCols: 4,
fields:[
{name:"Score",type:"float",defaultValue:-100,width:50}
]
});
this.addEmbeddedComponent(newOptions[key],groups[r],null,null,"within");
}
}
this.options = newOptions;
}
});How am I supposed to manage the components when rows are added/removed? Note, the effects I'm describing are independent of whether I'm deleting the last member of a group or not.
1) I would have expected the code above to do what I want, adding new components when new groups are added, and forgetting them when they're removed. With this code however, whenever a row is deleted I lose all my components from the ListGrid. Is that the expected behavior? I guess the groupTree is completely rebuilt from scratch, but the old objects aren't transferred over. If so, then that task would be my responsibility...
2) So if I move the addEmbeddedComponent outside the if/else block, I'd expect to be able to readd the original DynamicForms back into my ListGrid. However, if I do that, I get a long "blink" in the visual when my components disappear and then reappear. That's not very attractive... it looks like two redraws are being scheduled, the first without and the second with my components?
3) The other option of course is to reconstruct and readd my DynamicForms from scratch every time groupStateChanged is called (e.g. add "&& false" to my if statement). There's no "blink". However, I've noticed that redraws are a bit slow.
Between the three options (disappearing, blinking, or slow) I'd probably pick slow... but perhaps I am not understanding something? I realize putting components into group rows isn't a typical usage case, is there an approach I'm supposed to take? There aren't any examples with addEmbeddedComponent.