I want that when a user select a drop down item, a panel is fill with some UI elements...
I use the remove function the panel is never fill. I remove this line, UI elements are add one after the other
witch is not what i what...
Here is my script:
Code: Select all
{
var ar = ["Panel 1", "Panel 2", "Panel 3", "Panel 4"];
function myScript(thisObj) {
function myScript_buildUI(thisObj) {
var pal = (thisObj instanceof Panel) ? thisObj : new Window("palette", "My Window", undefined, {resizeable:true});
if(pal !== null) {
var res = "group{orientation: 'row',alignChildren:['Fill','Fill'], \
groupOne: Group{orientation: 'column',alignChildren:['Fill','Fill'], \
myStaticText: StaticText{text:'Choose a Panel:'},\
myDropDownList: DropDownList{},\
myPanel: Panel{alignment:['fill','top'],\
},\
},\
}";
var res2 = "group{orientation: 'column', alignment:['Fill','Fill'], alignChildren:['Fill','Fill'],\
myEditText: EditText{text: 'Item 2'},\
}";
var res3 = "group{orientation: 'column', alignment:['Fill','Fill'], alignChildren:['Fill','Fill'],\
myEditText: EditText{text: 'Item 3'},\
}";
var res4 = "group{orientation: 'column', alignment:['Fill','Fill'], alignChildren:['Fill','Fill'],\
myEditText: EditText{text: 'Item 4'},\
}";
pal.grp = pal.add(res);
// Populate dropdownlist
for (nba in ar) {
pal.grp.groupOne.myDropDownList.add('item', ar[nba]);
}
pal.grp.groupOne.myDropDownList.onChange = function() {
pal.remove(pal.grp.groupOne.myPanel.children[0]);
if (this.selection == 'Panel 1') pal.grp.groupOne.myPanel.add(res2);
if (this.selection == 'Panel 2') pal.grp.groupOne.myPanel.add(res3);
if (this.selection == 'Panel 3') pal.grp.groupOne.myPanel.add(res4);
// pal.grp.groupOne.myPanel.add(res2);
pal.layout.layout(true);
}
pal.layout.layout(true);
pal.grp.minimumSize = pal.grp.size;
pal.layout.resize();
pal.onResizing = pal.onResize = function() {this.layout.resize();}
}
return pal;
}
var win = myScript_buildUI(thisObj);
if((win != null) && (win instanceof Window)){
win.center();
win.show();
}
}
myScript(this);
}