Skip to content

Extension

Extension can be added to a section of a SectionedTable. It allows custom extension to be rendered in that section.

When assigning a rule to a property of Extension, the rule will be passed an instance of the following proxy class as an argument:

Extension Properties

Property Type Required Default
Class string Yes
Control string No
DataSubscriptions DataSubscriptions No
EmptySection EmptySection No
ExtensionProperties object No
Footer Footer No
Header Header No
Height integer No
IsScrollable boolean No false
Module string No
OnPress ActionOrRule No
Separators Separators No
Target LinkQueryFunctionTarget No
Visible boolean No true
_Name string No
_Type const Yes

Class

The name of the exported class in the module control that is to be used for the extension. On iOS, if no TS module is implemented, the native extension class targeted by this property must be declared as public to ensure proper lifecycle management.

  • type: string

Control

The name of the file under the controls folder in your module. e.g. MyExtension, if your file name is /extensions/controls/MyExtension.ts. If not specified, module name would be used as the value for this property.

  • type: string

DataSubscriptions

Array of data change events to subscribe to.

EmptySection

A section that will be displayed when the list is empty, this only applies if you are using Target binding. Allows you to show custom label when the list is empty.

ExtensionProperties

Additional custom properties to be passed to the extension

  • type: object

Footer

Footer bar to be displayed below this control's content section.

Header bar to be displayed above this control's content section.

Height

Height of the extension (pt in iOS / dp in Android)

  • type: integer

IsScrollable

If the height of the extension area cannot display the full content, you can use this property in the Section Extension control to enable nested scrolling within the extension view. This is Android only.

  • type: boolean
  • default: false

Module

The module's folder path under /extensions/, e.g. MyExtModule or MyExtLibrary/MyExtModule. On iOS, this property is optional, as the platform supports omitting TS code under /extensions/<Module>/controls.

  • type: string

OnPress

Action/Rule to be triggered when the extension is pressed

Separators

To provide more flexibility with rendering of controls and sections, set the visibility of the separator lines.

Target

Binding target for this extension. The result of this binding will be stored in the form of an Observable array and it can be accessed in the extension class via context.binding property of the base class, e.g. this.context.binding.

Visible

Visibility of the extension

  • type: boolean
  • default: true

_Name

UID to reference this control.

  • type: string

_Type

  • type: const

The value of this property must be:

"Section.Type.Extension"

Examples

{
  "_Type": "Page",
  "_Name": "SectionTablePage",
  "Caption": "Extension Section Page",
  "Controls": [{
    "_Type": "Control.Type.SectionedTable",
    "Sections": [{
      "_Type": "Section.Type.Extension",
      "_Name": "ExtensionTable",
      "Module": "MapsModule",
      "Control": "Maps",
      "Class": "CustomMap",
      "Height": 500,
      "ExtensionProperties": {
        "Configuration": {
            "EnableCurrentLocation": true,
            "EnableDynamicLayers": true,
            "EnableNearMe": true,
            "EnableFeatureLayers": true,
            "EnableBaseMaps": true
        },
        "Type": "TrafficMap",
        "Title": "Store Locations",
      },
      "OnPress": "/MDKApp/Actions/NavToDetailPage.action",
      "Target": {
            "EntitySet": "StoreLocations",
            "Service": "/MDKApp/Services/MyStore.service",
            "QueryOptions": "/MDKApp/Rules/Stores/GetLocalStoreQueryOptions.js"
      }
    }]
  }]
}