Nest an accordian component in another accordian problem

So what i am trying to do is nest an accordion component inside another accordion. I can get it to work in that they both show up. My problem lies with the 2nd accordion inside, i cant figure out where i need to set the height/width. Every place i tried to change it, it keeps it about the same size, which is about 1/3 of the area that exists. Here is the code that i’ve put together so far:


import mx.controls.*;
import mx.containers.*;
import mx.controls.gridclasses.DataGridColumn;


var EntAgBusArray = [["Title 1","Description 1"],["Title 2","Description 2"]]


this.createClassObject(Accordion, "mainSystems_acc", 7, {_x:0, _y:0});/* {_x:12, _y:291});*/
mainSystems_acc.setSize(Stage.width,Stage.height);

// Level 1 - list the pathways
// add the children to the Accordion component
var agbusSys = mainSystems_acc.createChild(mx.core.View, "sys1", {label:" Job System Category 1"});
var animalSys = mainSystems_acc.createChild(mx.core.View, "sys2", {label:" Job System Category 2"});
var envSys = mainSystems_acc.createChild(mx.core.View, "sys3", {label:" Job System Category 3"});

// Level 2 - List the jobs
agbusSys.createClassObject(Accordion, "agbus_jobs", getNextHighestDepth(), {_x:10, _y:0,});

// populate the sub accordion with text areas
var agbusSys_job1 = agbusSys.agbus_jobs.createChild(mx.core.View, "abjob1", {label:" "+EntAgBusArray[0][0]});
agbusSys_job1.createClassObject(TextArea, "agbus_acc", getNextHighestDepth(),{_x:0, _y:0});
agbusSys_job1.agbus_acc.setSize(300, 200);
agbusSys_job1.agbus_acc.text = EntAgBusArray[0][1]
agbusSys_job1.agbus_acc.wordWrap = true

var agbusSys_job2 = agbusSys.agbus_jobs.createChild(mx.core.View, "abjob2", {label:" "+EntAgBusArray[1][0]});
agbusSys_job2.createClassObject(TextArea, "agbus_acc", getNextHighestDepth(),{_x:0, _y:0});
agbusSys_job2.agbus_acc.setSize(300, 200);
agbusSys_job2.agbus_acc.text = EntAgBusArray[1][1]
agbusSys_job2.agbus_acc.wordWrap = true

the 2nd part of the problem is that i am trying to write a loop for popluating the sub areas, but it isnt working out so well. Here is what i tried to put together for the section (suppose to do the same thing as everything below “populate the sub accordion with text areas” above)


for (i=0; i<3; i++){
    var ["agbusSys_job"+i] = agbusSys.["agbusSys_job"+i]createChild(mx.core.View, "abjob"+i, {label:" "+EntAgBusArray[0][0]});
    ["agbusSys_job"+i]createClassObject(TextArea, "agbus_acc"+i, getNextHighestDepth(),{_x:0, _y:0});
    ["agbusSys_job"+i]["agbus_acc"+i]setSize(300, 200);
    ["agbusSys_job"+i]["agbus_acc"+i]text = EntAgBusArray[0]*
    ["agbusSys_job"+i]["agbus_acc"+i].wordWrap = true
        
}

Any help or suggestions you have would be greatly appreciated. Thanks for your time.