Dynamically attaching form to Layout

Hello all,
Am new to dhtmlx and JS in general.
I have Layout with 2 panels (configuration: 2U). On the left pane is a Tree and on the right pane is Form. I have 2 Forms and am trying to attach a particular one to the layout based on selected Tree row. I am able to get this to work (see code below)

[code] dhxTree.attachEvent(“onSelect”,attachForm);

function attachForm(id){
if (id <= 10){
dhxFormEx = dhxLayout.cells(“b”).attachForm(form1Data);
return;
}
else{
dhxFormNew = dhxLayout.cells(“b”).attachForm(form2Data);
return;
}
}
[/code]

However, since the Objects are defined within the function attachForm, seems like i am unable to use Form API since form object is not defined outside the scope of attachForm function.

i.e when i try to execute code below, it does not work

dhxFormNew.attachEvent("onChange", function(id){
	alert('am here!');
 })

Is there a way i can get this functionality to work? Many thanks in advance!

If you are not prefixing variables with “var” keyword - they will be created as global vars, and available outside, but they will be available only after form creation ( tree item selection )

You can use a little bit different strategy

  • create some form from the start
  • reload form with different configuration ( form.loadStruct, or form.loadStructString ) when necessary

Thanks Stanislav,
For now i am using the attachEvent Form API within the same dhxTree function call (see below). Will try your suggestion in future if i need to access it outside of dhxTree function call.

[code]dhxTree.attachEvent(“onSelect”,attachForm);

function attachForm(id){
if (id <= 10){
dhxFormEx = dhxLayout.cells(“b”).attachForm(form1Data);
dhxFormEx.attachEvent(“onChange”, function(id,value){
// code here …
}
}
else{
dhxFormNew = dhxLayout.cells(“b”).attachForm(form2Data);
dhxFormNew.attachEvent(“onChange”, function(id,value){
// code here …
}
}
}
[/code]