The ListAndForm control

The ListAndForm control is suitable for implementing interactive Master-Detail views inside a PowerForm, as it helps you to create a fully functional subform inside a form. It contains 2 controls, a list query datagrid and a subform enriched with New/Edit/Delete buttons.

You can view an in depth tutorial on how to use the List and Form control here.

Designer Properties

Type : ListandForm

Name

Provides a unique name for the control.

Binding

Not applicable for DataGrig control. Always unbound.

Enabled for new records

Sets if the control will be enabled or disabled when the forms handles a new record

Enabled for existing records

Sets if the control will be enabled or disabled when the forms handles an existing record

Required

Marks the cotnrol as Required.

By default, the system recognizes required fields and marks them with this flag. Additionaly, controls can be marked as required event if the bound column is not.

Enabled Formula

Set an expression then will be evaluated during run-time and enable or disable the control.

The expression must be in javascript and should return a boolean value.

Dependencies between controls are automatically identified and the expression is re-calculated every time a control affecting the formula changes.

Example :

Code

form.GetControl("c_Status").GetValue() != "Open" && form.UserInGroup("Administrators")

Visibility Formula

Define a valid formula (using javascript) that will be evaluated during runtime to show or hide the control.

The expression should return a boolean value.

For example :

Code

form.FieldValue("c_Status") != "Rejected" || form.UserID() == "1"

Value Properties

List Query

A predefined list query is bound to the value of the control. So during form initialization, the specified list query is executed and binds the data grid

IMPORTANT: In order for the control to work as expected, you will have to include the ID column in your list query.

Layout Properties

Width

Defines the width of the control.

When the value is zero, the maximum allowed width will be used.

Height

Defines the control height.

If the value is zero, the height property will not be set.

H.Alignment

Defines the horizontal alignment of the parent cell (values : left, right, center)

V.Alignment

Defines the vertical alignment of the parent cell (values : top, bottom, center)

Fore Color

Defines the fore color of the control

Back Color

Defines the Background color of the control.

Cell Color

Defines the color of the parent cell.

Margin

Sets the margin applied to the control, that is, the spacing between the control and the cell borders.

Font Bold

Changes the weight of the font used

Italics

Changes the font style for the control text

Extra Configuration

Filters

Add the column internal names for the fields that the list should be filtered by (eg ID;Title)

ShowFilter

Shows or Hides the filter control

ShowGrid

Shows or Hides the Search Grid

AutoSelectFirst

Automatically selects the first record (if any)

ContentType

Define the form content type

GridHeight

Define the grid height

AfterUpdateScript

Script to be executed after record update

DataLoadedScript

You can write a script that will be executed once the data to be bound to the datagrid are loaded, just BEFORE they are placed in the grid. The 'items' variable is available containing the items retrieved. This event is used if you want to alter the items before they are shown.

Code

for (var i=0; i < items.length; i++)

{

items[i].KPILookup = GetNameFromLookup(items[i].KPILookup);

}

Fields

Add the fields of the data entry grid

Properties

Name : The name of the field. It should begin with a letter and only contain letters, numbers and the underscore character

Header : The field header

Width : The grid column width. Leave blank for Auto sizing.

DisplayFormat : Indicates the way the value will be presented inside the data grid. (The value as-is, the ValueField or DisplayField for lookup controls (ID;#TITLE).

ForeColor : The cell foreground color

FontBold : The text weight

FontSize : The size of the font used

HAlign : Sets the Horizontal Alignment. (Left, Center, Right)

Default Values

Add Name/Value pairs to set default values for the control. The 'Name' property should be the column internal name and the value should be either static or calculated. (i.e. Name=Priority, Value=High or Name=Customer, Value={value:c_ID}

Properties

Name : The column internal name

Value: The default value of the column. Set either static values or calculated values based on form controls (i.e. {value:Field1})

Script

Sets the script that will be executed at the value-change event of the control.

Example :

Code

var value = form.GetControl("c_Title").GetValue();

if (value == "Open") form.HideSection("Details");

else form.ShowSection("Details");

The ListAndForm control

The ListAndForm control