Message with Dropdown

The message of type select displays a dropdown. You can give your dropdown a pre selected value by adding the "selected_item": {"text": "Porsche", "value":"porsche"} object to your select message.

To see the style options reference the Full JSON Schema. To see the functionality reference the Functionality Section.

Example

Example

Example’s JSON

{
  "head": {
    "text": "I am a header",
    "sub_head": {
      "text": "I am a sub header"
    }
  },
  "body": [
    {
      "type": "select",
      "text": "Cars",
      "select_items": [
        {
          "text": "Tesla",
          "value": "tesla"
        },
        {
          "text": "Ferrari",
          "value": "ferrari"
        },
        {
          "text": "Porsche",
          "value": "porsche"
        },
        {
          "text": "Mclaren",
          "value": "mclaren"
        }
      ]
    }
  ]
}

Full JSON Schema

{
  "type": "object",
  "properties": {
    "head": {
      "type": "object",
      "required": [
        "text"
      ],
      "properties": {
        "text": {
          "type": "string"
        },
        "style": {
          "type": "object",
          "properties": {
            "color": {
              "type": "string",
              "format": "Hex"
            },
            "bold": {
              "type": "boolean"
            },
            "italic": {
              "type": "boolean"
            }
          }
        },
        "sub_head": {
          "type": "object",
          "required": [
            "text"
          ],
          "properties": {
            "text": {
              "type": "string"
            },
            "style": {
              "type": "object",
              "properties": {
                "color": {
                  "type": "string",
                  "format": "Hex"
                },
                "bold": {
                  "type": "boolean"
                },
                "italic": {
                  "type": "boolean"
                }
              }
            }
          }
        }
      }
    },
    "body": {
      "type": "array",
      "items": {
        "type": "object",
        "required": [
          "type",
          "text"
        ],
        "properties": {
          "type": {
            "type": "string",
            "enum": [
              "select"
            ]
          },
          "text": {
            "type": "string"
          },
          "selected_item": {
            "type": "object",
            "required": [
              "text",
              "value"
            ],
            "properties": {
              "text": {
                "type": "string"
              },
              "value": {
                "type": "string"
              }
            }
          },
          "select_items": {
            "type": "array",
            "description": "Required if `static_source` is  **not** set.",
            "items": {
              "type": "object",
              "required": [
                "text",
                "value"
              ],
              "properties": {
                "text": {
                  "type": "string"
                },
                "value": {
                  "type": "string"
                }
              }
            }
          },
          "static_source": {
            "type": "string",
            "enum": [
              "members",
              "channels"
            ],
            "description": "Required if `select_items` is  **not** set."
          }
        }
      }
    }
  }
}

Functionality

Dynamic Dropdowns

The static_source key can populate the select_items array dynamically. The value of static_source can be set to either members, or channels.

ValueDescription
membersDisplays a dropdown list of members in the channel the message was sent to.
channelsDisplays a dropdown list of channels the user (who clicks the dropdown message) is in.

NOTE: When using static_source do not include select_items. When using select_items do not include static_source

User Actions

When a user selects an option in the dropdown, a POST request with data about the option selected is sent to the Bot Endpoint URL you specfied in your apps dashboard. Here is an example request body.

{
  "event": "interactive_message_select",
  "payload": {
    "accountId": "gVcjZnWWRLWvv_GtyGuaxg",
    "channelName": "Tommy Gaessler",
    "messageId": "20190618205440879_sRHVqf4_aw1",
    "original": {
      "head": {
        "sub_head": {
          "text": "I am a sub header"
        },
        "text": "I am a header"
      },
      "body": [
        {
          "select_items": [
            {
              "text": "Tesla",
              "value": "tesla"
            },
            {
              "text": "Ferrari",
              "value": "ferrari"
            },
            {
              "text": "Porsche",
              "value": "porsche"
            },
            {
              "text": "Mclaren",
              "value": "mclaren"
            }
          ],
          "text": "Cars",
          "type": "select"
        }
      ]
    },
    "robotJid": "v1m0yn1imztuogsxjje8fdew@xmpp.zoom.us",
    "selectedItems": [
      {
        "value": "tesla"
      }
    ],
    "timestamp": 1560891284464,
    "toJid": "kdykjnimt4kpd8kkdqt9fq@xmpp.zoom.us/robot_v1m0yn1imztuogsxjje8fdew@xmpp.zoom.us",
    "userId": "KdYKjnimT4KPd8KKdQt9FQ",
    "userJid": "kdykjnimt4kpd8kkdqt9fq@xmpp.zoom.us",
    "userName": "Tommy Gaessler"
  }
}

For more information, see the Dropdown Webhook Reference.

Need help?

If you're looking for help, try Developer Support or our Developer Forum. Priority support is also available with Premier Developer Support plans.