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 No "None"
AttributeLabel string No
Caption string No
FooterStyle enum No "Title"
OnPress ActionOrRule No
Styles object No
UseBottomPadding boolean No true
Visible boolean No true
_Name string No
_Type const No

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 one of the known values listed 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 one of the known values listed 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 No
Caption string No
AttributeLabel string No

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

Caption

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

AttributeLabel

The string value is a style class name of AttributeLabel. It is used to style the AttributeLabel 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

_Type

  • type: const

The value of this property must be:

"SectionCommon.Type.Footer"

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"
    }
  ]
}