Step 1: Create the action

In this example, you start with the action that defines the content of the survey. The action defines what is shown on the Card. Starting with the Action means that it will already exist when you create the Card interaction.

Result of step 1

To create the action interaction:

  1. In Designer, click Create Bot, enter a name for the bot and then click OK.
    For example enter Survey in the Name field.
  2. Drag an Action on to the Canvas.
  3. In the Name field, give the action a meaningful name. For example getSurveyCards.
  4. Select Set Variable as the action type.
    In this example we will use the Set Variable action to define the card as static JSON.
  5. Leave the Intention and When we receive fields empty. The action will be called directly by the card.
  6. Click the Settings tab to go to a page where you can copy, paste and edit code.
  7. The variable that will contain the list is defined like this, and is accessed through the context object:
    context.surveyCards = [
    ]
  8. Copy the following code to define the variable that will contain the list, and the two cards.
    context.surveyCards = 
    [
        {
            "title": "Sundaes",
            "subtitle": "With chocolate and cream",
             "image_url": "https://free-images.com/sm/3786/ice_cream_fruits_dessert.jpg",
             "buttons": [ 
                {"type": "postback", "title":"Chocolate", "payload":"flavor1"},
                {"type": "postback", "title":"Vanilla", "payload":"flavor2"},
                {"type": "postback", "title":"Strawberry", "payload":"flavor3"}
            ]
        },
        {
            "title": "Cones and tubs",
            "subtitle": "Wider choice of flavors",
            "image_url": "https://free-images.com/sm/6472/ice_cream_ice_cream_0.jpg",
            "buttons": [ 
                {"type": "postback", "title":"Ice creams", "payload":"type1"},
                {"type": "postback", "title":"Sorbets", "payload":"type2"},
                {"type": "postback", "title":"Frozen yogurt", "payload":"type3"}
            ]
        }
    ]

    There's more information about this in JSON format for cards.

  9. Click OK to save the action.
Step 2: Create the card