TimelineCell

Provide concise key information about timeline objects. These may be tappable to drill down into full details.

TimelineCell Properties

Property	Type	Required	Default
Attribute	string	Optional
Headline	string	Optional
OnPress	ActionOrRule	Optional
State	enum	Optional
Subhead	string	Optional
Timestamp	string	Optional
Visible	boolean	Optional	true
_Name	string	Optional

---

Attribute

On mobile, it will be ignored when state is Start / End.

• type: string

---

Headline

• type: string

---

OnPress

Action/Rule to be triggered when the image is pressed. On mobile, it will be ignored when state is Start / End.

• type: ActionOrRule
• Formatter and Binding are not supported

---

State

An icon and a label showing the status of the timeline object.

• type: enum

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

Value	Description
Start	The timeline item is a start node.
Open	The task is open.
Complete	The task is completed.
End	The timeline item is a end node.

---

Subhead

On mobile, it will be ignored when state is Start / End.

• type: string

---

Timestamp

The date time for the cell.

• type: string

---

Visible

Only valid for static section, will be ignored in dynamic sections.

• type: boolean
• default: true

---

_Name

• type: string

---

Example

Static

{
    "_Type": "Page",
    "_Name": "TimelineSectionPage",
    "Caption": "Timeline section Page",
    "Controls": [
        {
            "_Type": "Control.Type.SectionedTable",
            "_Name": "SectionedTable",
            "Sections": [
                {
                    "_Type": "Section.Type.Timeline",
                    "_Name": "StaticTimelineSection",
                    "Visible": true,
                    "Cells": [
                        {
                            "Cell": {
                                "Headline": "Start It",
                                "Timestamp": "2022-01-01T11:40:00Z",
                                "State": "Start"
                            }
                        },
                        {
                            "Cell": {
                                "Headline": "Applied Statistics",
                                "Subhead": "Class",
                                "Attribute": "Room 5461",
                                "Timestamp": "2022-01-02T14:20:00Z",
                                "State": "Complete",
                                "OnPress": "/MDKDevApp/Actions/Toast/Success.action"
                            }
                        },
                        {
                            "Cell": {
                                "Headline": "Numberic Analysis",
                                "Subhead": "Class",
                                "Attribute": "Room 4223",
                                "Timestamp": "2022-06-02T09:30:00Z",
                                "State": "Open",
                                "OnPress": "/MDKDevApp/Actions/Toast/Success.action"
                            }
                        },
                        {
                            "Cell": {
                                "Headline": "Complete Event",
                                "Timestamp": "2023-02-02T17:30:00Z",
                                "State": "End"
                            }
                        },
                        {
                            "Cell": {
                                "Headline": "Today Test",
                                "Subhead": "Class",
                                "Attribute": "Room 8888",
                                "Timestamp": "/MDKDevApp/Rules/timeline/GetToday.js",
                                "State": "Open",
                                "OnPress": "/MDKDevApp/Actions/Toast/Success.action"
                            }
                        }
                    ],
                    "TimestampType": "MonthDayTime"
                }
            ]
        }
    ]
}

Dynamic

{
    "_Type": "Page",
    "_Name": "TimelineSectionPage",
    "Caption": "Timeline section Page",
    "Controls": [
        {
            "_Type": "Control.Type.SectionedTable",
            "_Name": "SectionedTable",
            "Sections": [
                {
                    "_Type": "Section.Type.Timeline",
                    "_Name": "DynamicTimelineSection",
                    "Visible": true,
                    "Cell": {
                        "Headline": "{OrderDescription}",
                        "Subhead": "{OrderId}",
                        "Attribute": "{Priority}",
                        "Timestamp": "{CreationDate}",
                        "State": "/MDKDevApp/Rules/timeline/TimestampState.js",
                        "OnPress": "/MDKDevApp/Actions/Toast/Success.action"
                    },
                    "Target": {
                        "EntitySet": "MyWorkOrderHeaders",
                        "Service": "/MDKDevApp/Services/Amw.service",
                        "QueryOptions": "$top=20"
                    },
                    "TimestampType": "DayTime"
                }
            ]
        }
    ]
}