Skip to content

ContactTable

Contact Table is a table view container that manages and displays Contact Cells. It is used to give quick information of a contact and access to the various methods of communicating with a contact.

ContactTable Properties

Property Type Required Default
ContactCell ContactCellItem Optional
ContactCells object[] Optional
DataPaging DataPaging Optional
DataSubscriptions DataSubscriptions Optional
EmptySection EmptySection Optional
Footer Footer Optional
Header Header Optional
MaxItemCount integer Optional
Search Search Optional
Separators Separators Optional
Target LinkQueryFunctionTarget Optional
Visible boolean Optional true
_Name string Optional
_Type const Required

ContactCell

A cell showing a contact info as well as various methods. Can't co-exist with ContactCells.

ContactCells

Static ContactCell collection. MaxItemCount and Target are ignored.

Can't co-exist with ContactCell.

  • type: object[]

All items must be of the type: object with following properties:

Property Type Required
ContactCell Optional

ContactCell

DataPaging

Configure the loading indicator shown at the end of the list, when loading next page of data.

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.

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

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

MaxItemCount

If MaxItemCount is not specified, then all records are displayed in the section.

  • type: integer

Defines if search is to be enabled in the ContactTable. If more than one searchable section is provided in the SectionedTable, then the search definition from the first searchable section is used in defining the search bar behavior in the SectionedTable. If there is a Search object defined with Enabled set to true, search will be enabled. In iOS, when a ContactTable is used alongside a header control (KPIHeader/ProfileHeader/ObjectHeader), search bar is not enabled.

Separators

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

Target

Service Target definition for binding with ContactCell.

Visible

Set the visibility of this control.

  • type: boolean
  • default: true

_Name

  • type: string

_Type

  • type: const

The value of this property must be equal to:

"Section.Type.ContactCell"

Examples

{
  "_Type": "Page",
  "_Name": "ContactCellPage",
  "Caption": "Contact Cell Page",
  "Controls": [
    {
      "_Type": "Control.Type.SectionedTable",
      "_Name": "SectionedTable",
      "Sections": [
        {
          "_Type": "Section.Type.ContactCell",
          "_Name": "Contacts",
          "DataPaging": {
            "ShowLoadingIndicator": true,
            "LoadingIndicatorText": "Loading more items, please wait…"
          },
          "ContactCells": [
            {
              "ContactCell":
                {
                  "DetailImage": "/MDKApp/Images/icon.png",
                  "Headline": "Pathik Chitania",
                  "Subheadline": "Software Developer",
                  "Description": "3010 Highland Pkwy, Suite 900, Downers Grove, IL 60515",
                  "ActivityItems": [
                    {
                      "ActivityType": "VideoCall",
                      "ActivityValue": "630-667-7983"
                    },
                    {
                      "ActivityType": "Email",
                      "ActivityValue": "pathik.chitania@sap.com"
                    },
                    {
                      "ActivityType": "Detail",
                      "ActivityValue": "This is an alert"
                    }
                  ]
                }
              },
            {
              "ContactCell":
              {
                "DetailImage": "/MDKApp/Images/icon.png",
                "Headline": "Pathik Chitaniai",
                "Subheadline": "Software Developer",
                "Description": "3010 Highland Pkwy, Suite 900, Downers Grove, IL 60515",
                "ActivityItems": [
                  {
                    "ActivityType": "Phone",
                    "ActivityValue": "630-667-7983"
                  },
                  {
                    "ActivityType": "Email",
                    "ActivityValue": "pathik.chitania@sap.com"
                  },
                  {
                    "ActivityType": "Message",
                    "ActivityValue": "630-667-7983"
                  }
                ]
              }
            }
          ]          
        }
      ]
    }
  ]
}

Examples with Swipe

{
  "Caption": "Contact Cell Page",
  "Controls": [
    {
      "Sections": [
        {
          "ContactCell": 
            {
              "Headline": "{CustomerName}",
              "Subheadline": "{City}",
              "Description": "{Country}",
              "ActivityItems": [
                {
                  "ActivityType": "VideoCall",
                  "ActivityValue": "630-667-7983"
                },
                {
                  "ActivityType": "Email",
                  "ActivityValue": "pathik.chitania@sap.com"
                },
                {
                  "ActivityType": "Detail",
                  "ActivityValue": "{CustomerID}"
                }
              ],
              "ContextMenu": {
                "PerformFirstActionWithFullSwipe": true,
                "LeadingItems": ["Toast", "Alert"],
                "TrailingItems": ["Banner", "ShowMessage"],
                "Items":[
                  {
                    "_Name": "Toast",
                    "Text": "Toast",
                    "Image": "/MDKApp/Images/toast.png",
                    "Mode": "Normal",
                    "OnSwipe": "/MDKDevApp/Actions/Message/ToastMessage.action"
                  },
                  {
                    "_Name": "Alert",
                    "Text": "Alert",
                    "Image": "/MDKApp/Images/alert.png",
                    "Mode": "Normal",
                    "OnSwipe": "/MDKDevApp/Actions/Message/AlertMessage.action"
                  },
                  {
                    "_Name": "Banner",
                    "Text": "Banner",
                    "Image": "/MDKApp/Images/banner.png",
                    "Mode": "Normal",
                    "OnSwipe": "/MDKDevApp/Actions/Message/BannerMessage.action"
                  },
                  {
                    "_Name": "ShowMessage",
                    "Text": "Show Message",
                    "Image": "sap-icon://message",
                    "Mode": "Normal",
                    "OnSwipe":"/MDKApp/Actions/Message/ShowMessage.action"
                  }
                ]
              }
            },
          "Target": {
            "EntitySet": "Customers",
            "Service": "/MDKDevApp/Services/CPXSNorthwind.service",
            "QueryOptions": "$filter=Country eq 'USA'"
          },
          "_Type": "Section.Type.ContactCell",
          "_Name": "CustomerContacts"
        }
      ],
      "_Type": "Control.Type.SectionedTable",
      "_Name": "SectionedTable"
    }
  ],
  "_Type": "Page",
  "_Name": "SectionedTablePage"
}