How to populate two other combo boxes according to value in first combo box?

Dear all,

I have 3 combo boxes: box1, box2, box3. I would like when I select a value in box1 to have box2 with values according to box1 and then box3 have values according to box2. I have started to write the code below. I don’t know how to finalise it to make it works correctly. 

CODE

//First you make the values for box1.

myBox1Values = ["","CAP","FOD","GOV","RET","RES","NOF","OTH"]; 

//Then you populate the values to box1.

{this.getField("box1").setItems(myBox1Values)}; 

// Then you define what has to be shown in box2 when value is selected

var DeptData = {CAP:["AGR"], FOD:["","BAK","BEV"]}; 

//Finally you set the values of box2 function

SetFieldValues(cDeptName) {   this.getField("box2").setItems(DeptData[cDeptName]); } 

// Then you define what has to be shown in box3 when value is selected

var DeptData = {AGR:["","CRO","ANI","FIS"]}; 

//Finally you set the values of box3 function

SetFieldValues(cDeptName) {   this.getField("box3").setItems(DeptData[cDeptName]); }