Form field

View as Markdown

The fields message type displays form fields that you can edit or use to display with a label and value. This message type also supports Markdown and @mentions.

  • To add a default value for a form field, set a value for the "value" key. Or pass in a space to make it blank. For example: "value": " ".
  • To allow editing, add the "editable": true key value. To enable read only, set it to false.
  • If two sequential key/value pairs have the short style set to true, then clients can display both pairs side-by-side in two columns.
    • macOS and Windows clients always displays the pairs side-by-side, even if they need line breaks.
    • Android and iOS clients always display short fields in two columns if the keys and values do not require line breaks. If the keys or values require line breaks, a mobile client may display the fields as stacked.

Example

Example

JSON example

{
  "head": {
    "text": "I am a header",
    "sub_head": {
      "text": "I am a sub header"
    }
  },
  "body": [
    {
      "type": "fields",
      "items": [
        {
          "key": "Name",
          "value": " ",
          "editable": true
        },
        {
          "key": "Title",
          "value": " ",
          "editable": true
        },
        {
          "key": "Company",
          "value": "Zoom",
          "editable": false
        }
      ]
    }
  ]
}

User actions

When a user fills out a form field, a POST request with data about the form field is sent to the Bot Endpoint URL you specified in your apps dashboard. Here is an example request body.

{
  "event": "interactive_message_fields_editable",
  "payload": {
    "accountId": "gVcjZnWWRLWvv_GtyGuaxg",
    "channelName": "Tommy Gaessler",
    "fieldEditItem": {
      "currentValue": "",
      "key": "Title",
      "newValue": "Developer Advocate"
    },
    "messageId": "20190618205323327_EZjIqCQ_aw1",
    "original": {
      "head": {
        "sub_head": {
          "text": "I am a sub header"
        },
        "text": "I am a header"
      },
      "body": [
        {
          "type": "fields",
          "items": [
            {
              "editable": true,
              "value": " ",
              "key": "Name"
            },
            {
              "editable": true,
              "value": " ",
              "key": "Title"
            },
            {
              "editable": false,
              "value": "Zoom",
              "key": "Company"
            }
          ]
        }
      ]
    },
    "robotJid": "v1m0yn1imztuogsxjje8fdew@xmpp.zoom.us",
    "timestamp": 1560891222018,
    "toJid": "kdykjnimt4kpd8kkdqt9fq@xmpp.zoom.us/robot_v1m0yn1imztuogsxjje8fdew@xmpp.zoom.us",
    "userId": "KdYKjnimT4KPd8KKdQt9FQ",
    "userJid": "kdykjnimt4kpd8kkdqt9fq@xmpp.zoom.us",
    "userName": "Tommy Gaessler"
  }
}