Skip to content

Footer

This is a section bar control to add a footer bar to a compound and container control.

Property Type Required Default
AccessoryType enum Optional "None"
AttributeLabel string Optional
Caption string Optional
FooterStyle enum Optional "Title"
OnPress ActionOrRule Optional
Styles object Optional
UseBottomPadding boolean Optional true
Visible boolean Optional true
_Name string Optional

AccessoryType

Optional accessory icon to be displayed in the cell. Applicable only for iOS and web.

  • type: enum
  • default: None

The value of this property must be equal to one of the known values below.

Value Description
DisclosureIndicator A chevron-shaped control for presenting new content on iOS and web.
None No accessory view.

AttributeLabel

Text label for the attribute content. Not supported in 'Help' and 'Title' style footers.

  • type: string

Caption

Text label for the caption content.

  • type: string

FooterStyle

A style to be applied on the footer control.

  • type: enum
  • default: Title

The value of this property must be equal to one of the known values below.

Value Description
Attribute Displays both the Caption text and Attribute Label of the footer on Android, iOS, and Web. The footer is clickable for this style.
Help Displays only the Caption text of the footer on Android, iOS, and Web. The Caption will be centred on the footer. The footer is not clickable for this style.
Title Displays only the Caption text of the footer on Android, iOS, and Web. The footer is clickable for this style.

OnPress

Action or rule to be performed when the event is triggered. Not supported in 'Help' style footers. The ClientAPI object to be received in rule function is SectionProxy.

Styles

Set styles for footer.

  • type: object with following properties.
Property Type Required Default
Footer string Optional
Caption string Optional
AttributeLabel string Optional

The string value is a style class name for Footer. It is used to set the background color of the Section Footer.

Caption

The string value is a style class name for Caption. It is used to style the Caption text on the Section Footer.

AttributeLabel

The string value is a style class name for AttributeLabel. It is used to style the Attribute Label text on the Section Footer.

UseBottomPadding

For iOS devices, this property shows or hides the bottom padding of the section footer (gray separator).

For Android devices, this property is not applicable, as there is no gray separator after the footer.

  • type: boolean
  • default: true

Visible

Shows or hides the section footer.

  • type: boolean
  • default: true

_Name

  • type: string

The footer will be shown or hidden based on the following combinations;

EmptySection.FooterVisible Footer.Visible Is Section Empty? Shown
false true true false
false true false true
false false true false
false false false false
true true true true
true true false true
true false true false
true false false false

Examples

// Footer metadata
{
  "Sections": [
    {
      "EmptySection": {  
        "Caption": "EmptySection Caption",
        "FooterVisible": true
      },
      "Footer": {
        "Caption": "This is an 'attribute' style footer",
        "AccessoryType": "DisclosureIndicator",
        "AttributeLabel": "7 (the attribute)",
        "FooterStyle": "Attribute",
        "OnPress": "/MyMDKApp/Actions/ShowMessage.action",
        "Visible": true,
        "Styles": {
          "Footer": "footer-css-class",
          "Caption": "caption-css-class",
          "AttributeLabel": "attribute-label-css-class"
        }
      },
      "Layout": {
        "NumberOfColumns": 1
      },
      "ObjectCells": [{  
        "ObjectCell": {
          "Footnote": "Footnote",
          "AccessoryType": "disclosureIndicator",
          "Title": "Title",
          "SubstatusText":" SubstatusText",
          "Subhead": "Support"
        }
      }],
      "_Type": "Section.Type.ObjectCollection"
    }
  ]
}

Title Style

This style provides a caption only. 

// Footer metadata
{
  "Sections": [
    {
      "Footer": {
        "Caption": "This is a 'Title' style footer (the default)"
      },
      "KeyAndValues": [
        {
          "KeyName": "FirstName",
          "Value": "Lewis"
        },
        {
          "KeyName": "LastName",
          "Value": "Black"
        },
        {
          "KeyName": "Emails",
          "Value": "lewisblack@example.com"
        }
      ],
      "_Type": "Section.Type.KeyValue"
    }
  ]
}

Attribute Style

This style provides a caption and an attribute. 

// Footer metadata
{
  "Sections": [
    {
      "Footer": {
        "Caption": "This is an 'attribute' style footer",
        "AccessoryType": "DisclosureIndicator",
        "AttributeLabel": "7 (the attribute)",
        "FooterStyle": "Attribute",
        "OnPress": "/MyMDKApp/Actions/ShowMessage.action",
        "Visible": true
      },
      "Layout": {
        "NumberOfColumns": 1
      },
      "SimplePropertyCells": [
        {
          "SimplePropertyCell": {
            "KeyName": "Do"
          }
        },
        {
          "SimplePropertyCell": {
            "KeyName": "Re"
          }
        },
        {
          "SimplePropertyCell": {
            "KeyName": "Mi"
          }
        }
      ],
      "_Type": "Section.Type.SimplePropertyCollection"
    }
  ]
}

Help Style

Use this style to provide help on the section. Useful with Button Table sections. 

{
  "Sections": [
    {
      "Footer": {
        "Caption": "This is a 'Help' style footer",
        "FooterStyle": "Help"
      },
      "Buttons": [{
          "Title": "Close",
          "OnPress": "/MyMDKApp/Actions/Navigation/ClosePage.action",
          "TextAlignment": "Center"
      }],
      "_Type": "Section.Type.ButtonTable"
    }
  ]
}