Frame Tree

This chapter describes the interrelationship of forms in detail by using diagrams.

Notation

This section describes the notation used to diagram how frames interrelate.

Box

A box represents an item on the collection.

Connection Line

A connection corresponds to a 1:1 connection. The circular shape is connected to a child item. The text on the box is a concept not a name.

The following indicates a 1:N connection. The crow's foot-shape is connected to the child(ren).

Description

The description on the connection line presents the script grammar between items:

The above description expresses the connection syntax:

Definition of Terms

Term

Description

element

The properties, methods, events of a component are referred to as its elements

Commonly Used Syntax

Index or ID can be placed in '[', ']'.

For example, both this.all[0] and this.all['btn0'] can indicate the same component.

Form

Relationship Schematic

General Form

frame_tree_form

Container Component

frame_tree_form_div

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.

Script Approach to Components / Invisible Objects / Bind

this.classname == "frm0"
this.name == "frm0"
// Approach 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"
// Approach 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 component / invisible object / bind
this.all.length == 7
this.components.length == 5 //btn0, btn1, comb0, div0, div1
this.binds.length == 1

Script Approach to Container Components

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

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

Script Approach to Container Components Connecting Forms

// (in case of the script in frm1) Approach to btn0 in frm1
this.name == "div1"
this.btn0.name == "btn0"
this.all["btn0"].name == "btn0"
// (in case of the script in frm0) Approach to dtset1 in frm1
this.name == "frm0"
this.div1.btn0.name == "btn0" //It is approachable only with "divl" which

Script Usage of Parents

this.div1.dtset2.parent.parent.classname == "frm0"
this.div1.dtset2.parent.name == "div1" // As frm1 is connected to div1, it becomes to lose its characteristics.
this.div1.dtset2.parent.classname == undefined // As frm1 is connected to div1, it becomes to lose its characteristics and the classname doesn’t exist.
this.div1.dtset2.parent.name == "div1"

Element Usage of Container Components

Application

Relationship Schematic

frame_tree_application

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

Script Example Screen

frame_tree_script_application

Form Approach to Script at Application

// Approach to frm0 (in case of ChildFrame)
application.mainframe.frame.form.name =="frm0"
application.mframe0.frame.form.name == "frm0"
application.mframe0.chdframe0.form.name == "frm0"
application.all[0].all[0].form.name == "frm0"
application.all["mframe0"].all["chdframe0"].form.name == "frm0"
this.mainframe.frame.form.name == "frm0"

Application Approach to Script at Form

// approach to application at frm0 (in case of ChildFrame)
this.parent.name == "chdframe0"
this.parent.parent.name == "mframe0"
this.getOwnerFrame().getOwnerFrame().name == "mframe0"
this.getOwnerFrame().getOwnerFrame().parent.mainframe.name == "mframe0"