Assign Xml Values to dynamically created components

Question

xml values are stored in 'arr' array collection. depending on the length of the array stored, the below described components are created and assign those values to relevant components dynamically.

For Example:

AdvanceSearch.mxml is one component, and another components as advanceSearchAtom.mxml. within 'advanceSearchAtom' has some sub components as textbox, combo box etc,. we can add many advanceSearchAtom.mxml inside 'AdvanceSearch.mxml'.

var container : AdvanceSearch;

var adv : advanceSearchAtom;

for(var i:int=0;i<arr.length;i++) {
  adv = new advanceSearchAtom();

  adv.field.text = arr[i].field; 
  adv.value.selectedIndex = arr[i].value;

  container.addChild(adv); 
}

Please let me know if anybody come across this type of problem. if any relevant link is appreciable. Thanks in advance

Answer 1

You didn't mention it, but I guess the problem is that you're getting null reference error (1009) on the following lines:

adv.field.text = arr[i].field; 
adv.value.selectedIndex = arr[i].value;

Am I right?

This is because field and value are not yet created. As per the default component instantiation, Flex creates the children only when it is required - i.e., when it is to be displayed.

You can either listen to the creationComplete event of the AdvanceSearchAtom component and update the values from there; or have Binadble public variables in the AdvanceSearchAtom class, bind them to field.text and value.selectedIndex and assign xml values to those variables in the loop.

Using creation complete:

public var container:AdvanceSearch;
public var searchItems:Array = [];
public var arr:Array;

//assuming that arr has been initialized with xml values.
var adv:AdvanceSearchAtom;
for(var i:int=0;i<arr.length;i++) {
  adv = new AdvanceSearchAtom();
  adv.addEventListener(FlexEvent.CREATION_COMPLETE, onAtomCreated);
  container.addChild(adv); 
  searchItems.push(adv);
}

public function onAtomCreated(e:Event):void
{
   var adv:AdvanceSearchAtom = e.currentTarget as AdvanceSearchAtom;
   if(!adv)
      return;
   var index:Number = searchItems.indexOf(adv);
   adv.field.text = arr[index].field;
   adv.value.selectedIndex = arr[index].value;
}

Using data binding:

Inside AdvanceSearchAtom.mxml

<mx:TextInput id="field" text="{textValue}"/>
<mx:ComboBox id="value" selectedIndex="{comboIndex}"/>

In the script block of AdvanceSearchAtom.mxml

[Bindable]
public var textValue:String;

[Bindable]
public var comboIndex:Number;
var adv:AdvanceSearchAtom;

In the AdvanceSearch class:

for(var i:int=0;i<arr.length;i++) {
  adv = new AdvanceSearchAtom();
  container.addChild(adv); 
  adv.field.text = arr[i].field; 
  adv.value.selectedIndex = arr[i].value;
}