How to understand Controls references

The reference provides access to a Control from JavaScript.

When Controls are created the references are stored into JavaScript object. Properties are names of references and values are the references.

Example

AppForm = new ngControls({

  Label1: {
    Type: 'weLabel',
    L: 20, T: 20,
    Data: {
      Text: 'Name:'
    }
  },
  Edit1: {
    Type: 'weEdit',
    L: 80, T: 20, W: 150,
    Data: {
      Text: 'John'
    }
  },

});

Created AppForm object holds references Edit1 and Label1:

Example of getting text of edit box: AppForm.Edit1.GetText();

Created Controls have property Owner which is the references holder object (AppForm).

Note: All references are stored into the same object, i.e. references not following the Controls definition hierarchy.

Make Control to hold references

Control can hold references to other Controls (usually its children). Set ParentReferences to FALSE in Control definition or use appropriate container Control type - for instance ngFrame.

AppForm = new ngControls({

  Frame1: {
    Type: 'ngFrame',
    L: 0, T: 0, R: 0, B: 0,
    Controls: {

      Label1: {
        Type: 'weLabel',
        L: 20, T: 20,
        Data: {
          Text: 'Name:'
        }
      },
      Edit1: {
        Type: 'weEdit',
        L: 80, T: 20, W: 150,
        Data: {
          Text: 'John'
        }
      }

    }
  }
});

Created Frame1 Control holds references Edit1 and Label1:

Example of getting text of edit box: AppForm.Frame1.Controls.Edit1.GetText();

Holding references on Control helps building independent functional blocks.

See more How-Tos