Frame Tree

While you can make a simple single-form screen in Nexacro Platform, you can also develop an type structure that can perform multiple associated tasks. Such a structure is so complicated that you need to learn how its constitutes interact with each other.

This chapter helps you understand such complicated structures by presenting several examples.

Application

// application -> mainframe
this.mainframe
this.id
this.all[n]
this.all['id']

// mainframe -> application
this.mainframe.parent

// mainframe -> childframe
this.mainframe.frame
this.mainframe.all[n]
this.mainframe.all['id']
this.mainframe.id

// childframe -> mainframe
this.mainframe.frame.parent
this.mainframe.frame.getOwnerFrame()

// childframe -> form
this.mainframe.frame.form

// form -> childframe
this.parent
this.getOwnerFrame()
nexacro.getApplication().mainframe.frame

The component/bind/invisible object in the Form does not have either .getOwnerFrame() nor .getOwnerForm().

Script Example Screen

frame_tree_script_application

Accessing Form Object from Application

// Approach to frm0 
this.mainframe.frame.form.name =="frm0"
this.mframe0.frame.form.name == "frm0"
this.mframe0.chdframe0.form.name == "frm0"
this.all[0].all[0].form.name == "frm0"
this.all["mframe0"].all["chdframe0"].form.name == "frm0"
this.mainframe.frame.form.name == "frm0"

Accessing Parent Objects from Form

// approach to application at frm0 
this.parent.name == "chdframe0"
this.parent.parent.name == "mframe0"
this.getOwnerFrame().getOwnerFrame().name == "mframe0"
nexacro.getApplication().mainframe.name == "mframe0"

Form

A form has one on N structure, which implies that a single independent form interacts with its affiliated objects, binds and components. The below script codes are syntax examples of how to access the objects, binds and components in a Form.

// Form -> Object
this.all[n]
this.all['id']
this.id
this.objects[n]
this.objects['id']

// Form -> Bind
this.all[n]
this.all['id']
this.id
this.binds[n]
this.binds['id']

// Form -> Component
this.all[n]
this.all['id']
this.id
this.components[n]
this.components['id']

// Object, Bind, Component -> Bind
this.all[n].parent

You can connect a Form to a container component like a Div, PopupDiv and Tabpage through the url property. In this case, a one on one structure will apply between a container component and its connected form. The below script codes are syntax examples of how to access the objects, binds and components in the Form.

// Container Component -> Object
this.Div.form.all[n]
this.Div.form.all['id']
this.Div.form.id
this.Div.form.objects[n]
this.Div.form.objects['id']

// Container Component -> Bind
this.Div.form.all[n]
this.Div.form.all['id']
this.Div.form.id
this.Div.form.binds[n]
this.Div.form.binds['id']

// Container Component -> Component
this.Div.form.all[n]
this.Div.form.all['id']
this.Div.form.id
this.Div.form.components[n]
this.Div.form.components['id']

// Object, Bind, Component -> Container Component
this.Div.form.all[n].parent.parent

The all, objects, binds, and components properties are provided in the form of nexacro.Collection. That is to say, you can access each property with an index or ID in the Collection object.

When you use the all property, the indexes within the Collection object are determined in the order described below.

1. Object

2. Component

3. Bind

Among the same types, the order of indexes follows the sequence of the source codes.

Script Example Screen

frame_tree_script_01

Index order is assumed to be in the order of dtset1, btn0, btn1, cmb0, div0, div1 and bind1. In general Forms, the index order begins with Dataset, followed by remaining components as they are assigned and bind objects are at the end.

In a Form on the same level, the ID cannot be duplicated. In other words, since btn0 and div0_btn0 and div2_btn are not the same levels, they may be designated as the same ID.

Components / Objects / Bind

this.name == "frm0"
// Access to btn0
this.all["btn0"].name == "btn0"
this.all[1].name == "btn0"
this.btn0.name == "btn0"
this.components[0].name == "btn0"
this.components["btn0"].name == "btn0"
// Access to dtset1
this.all["dtset1"].name == "dtset1"
this.all[0].name == "dtset1"
this.dtset1.name == "dtset1"
this.objects[0].name == "dtset1"
this.objects["dtset1"].name == "dtset1"
// Number of components / invisible objects / binds
this.all.length == 7
this.components.length == 5 //btn0, btn1, comb0, div0, div1
this.binds.length == 1

Container Components

A container component without a connection to a Form can dynamically have invisible objects / bind.

// Access to div0_btn0 inside div0
this.div0.form.div0_btn0.name == "div0_btn0"
this.div0.form.all[0].name == "div0_btn0"
this.components[3].form.components[0].name == "div0_btn0"
// Access to div2_btn0 inside div2
this.div0.form.div2.form.div2_btn0.name == "div2_btn0"
this.all["div0"].form.all["div2"].form.all["div2_btn0"].name == "div2_btn0"
this.components["div0"].form.components["div2"].form.components["div2_btn0"].name == "div2_btn0"

Container Component Connected to Form

// (in case of the script in frm1) Access to btn0 in frm1
this.parent.name == "div1"
this.btn0.name == "btn0"
this.all["btn0"].name == "btn0"
// (in case of the script in frm0) Access to btn0 in frm1
this.name == "frm0"
this.div1.form.btn0.name == "btn0"

Parents

this.div1.form.dtset2.parent.parent.name == "form" // it is not frm0
this.div1.form.dtset2.parent.name == "div1"