DetailView

A call to action that opens a web page in an iFrame.

The parameters for DetailView are:

Name Type Default Values Description
url string - - the url you want to open in the webview
description string - - the description that appears on the call to action
title string - - the title that appears at the top of the webview
interactionType string - event event sends a markup interaction on close or complete
showBackButton string true true, false whether the back button should be shown
allowCamera string true true, false allows detail view to share access with the camera for messenger.

An example of DetailView markup is:

Detail Views with User input

Detail views are sent as just messages by default. It is possible for detailviews to be expanded to take further input for filling slots (using SBIntents) or to wait for user input (using a markup interaction node in Classic Flow).

Specifiy interactionType=event in your DetailView markup:

The markup above will create two potential events depending on user interactions.

  • Close when the user closes the detailview

  • Complete to register when the main task on a detail view page is complete.

      window.parent.parent.postMessage({
      type: "completeServisBotTask",
      closeOnComplete: true,
  },
  "https://mydomain.com"
  );

Additional data can also be sent from the detail view to the bot with the completion event.

To capture data on the completion of an action within a post message, a has to be sent to ServisBOT messenger from the iFramed page:

  • Data contained in a ‘message.data’ object will be sent along with the event to the bot.

The iFramed page should send a complete action post to its parent in the following format

 window.parent.parent.postMessage(
    {
      type: "completeServisBotTask",
      message: { 
        data : { 
          itemSelected: 2 
        } 
      },
      closeOnComplete: true
      }
    },
    "https://mydomain.com"
  );