Edit View Layout - Sage/argos-sdk GitHub Wiki

The Edit View, in contrast to the Detail View, is rendered when the application starts. The only change that happens upon navigation is setting the initial values. This is an important distinction because most of the functionality and logic are in the Field Types code, not the layout itself.

The layout for a detail view is described by a list of layout definitions. There are primarily two types of layout definitions: section definitions, and field definitions.

This definition describes a new section to be displayed. The view always has one default section and any additional ones are rendered sequentially, in order of access, after the default section. There are a number of options that control how the section will be displayed.

• children: A list of child layout definitions to use.
• title: The title to be displayed for the section.
• list: true to render the section as a list, false to render it as a field set.

This definition describes a field to be displayed. There are a number of options that control how the property will be displayed.

• label: A label to be displayed next to the field.
• name: The unique name that identifies the field, in dot-path notation. If it’s not set, then property value is used.
• property: Property of the SData response to tie this field to.
• type: The type of control to use. Defaults to “text”.
• validator: A validator definition to use. Can be one of the following:
  • A RegExp instance.
  • A function that accepts a value, and an optional editor instance, and returns false when valid or a string with the error message when not valid.
  • An object with the following properties:
    • fn: A function to use for validation (see function option above).
    • test: A RegExp to use for validation (see RegExp option above).
    • message: A message to use if validation fails. Can be a format string that accepts a value and a field (in that order) or a function that accepts a value and a field (in that order) and returns a string with the error message.

These options pertain to a field with a type of text.

• validationTrigger: The trigger to use for validation. Can be set to false, or nothing, for explicit validation, or one of the following options:
  • keyup: Validation occurs on key up.
  • blur: Validation occurs when the field is blured.
• validInputOnly: The field will only accept valid input.
• inputType: Changes the type= attribute of the input element. Used for HTML5 input types (phone, email, number, etc.)
• enableClearButton: Adds a clear input button.

/* Simple number field: */
    {
        label: this.quantityText,
        name: 'Quantity',
        property: 'Quantity',
        type: 'decimal'
    }