OpenDialog Docs
opendialog.aiStart BuildingTalk to an expert
  • GETTING STARTED
    • Introduction
    • Getting ready
    • Billing and plans
    • Quick Start AI Agents
      • Quick Start AI Agent
      • The "Start from Scratch" AI Agent
        • Chat Management Conversation
        • Welcome Conversation
        • Topic Conversation
        • Global No Match Conversation
        • Supporting LLM Actions
        • Semantic Classifier: Query Classifier
      • A Process Handling AI Agent
  • STEP BY STEP GUIDES
    • AI Agent Creation Overview
    • Add a new topic of discussion
    • Use knowledge sources via RAG
    • Adding a structured conversation
    • Add a 3rd party integration
    • Test and tweak your AI Agent
    • Publish your AI Agent
  • CORE CONCEPTS
    • OpenDialog Approach
      • Designing Conversational AI Agents
    • OpenDialog Platform
      • Scenarios
        • Conversations
        • Scenes
        • Turns and intents
      • Language Services
      • OpenDialog Account Management
        • Creating and managing users
        • Deleting OpenDialog account
        • Account Security
    • OpenDialog Conversation Engine
    • Contexts and attributes
      • Contexts
      • Attributes
      • Attribute Management
      • Conditions and operators
      • Composite Attributes
  • CREATE AI APPLICATIONS
    • Designing your application
      • Conversation Design
        • Conversational Patterns
          • Introduction to conversational patterns
          • Building robust assistants
            • Contextual help
            • Restart
            • End chat
            • Contextual and Global No Match
            • Contextual FAQ
          • Openings
            • Anatomy of an opening
            • Transactional openings
            • Additional information
          • Authentication
            • Components
            • Example dialog
            • Using in OpenDialog
          • Information collection
            • Components
            • Example dialog
            • Using in OpenDialog
            • Additional information
          • Recommendations
            • Components
            • Example dialog
            • Additional information
          • Extended telling
            • Components
            • Example dialog
            • Additional information
          • Repair
            • Types of repair
            • User request not understood
            • Example dialog
            • Additional information
          • Transfer
            • Components
            • Example dialog
            • Additional information
          • Closing
            • Components
            • Example dialog
            • Using in OpenDialog
            • Additional information
        • Best practices
          • Use Case
          • Subject Matter Expertise
          • Business Goals
          • User needs
            • Primary research
            • Secondary research
            • Outcome: user profile
          • Assistant personality
          • Sample dialogs
          • Conversation structure
          • API Integration Capabilities
          • NLU modeling
          • Testing strategy
          • The team
            • What does a conversation designer do
          • Select resources
      • Message Design
        • Message editor
        • Constructing Messages
        • Message Conditions
        • Messages best practices
        • Subsequent Messages - Virtual Intents
        • Using Attributes in Messages
        • Using Markdown in messages
        • Message Types
          • Text Message
          • Image Message
          • Button Message
          • Date Picker Message
          • Audio Message
          • Form Message
          • Full Page Message
          • Conversation Handover message
          • Autocomplete Message
          • Address Autocomplete Message
          • List Message
          • Rich Message
          • Location Message
          • E-Sign Message
          • File Upload Message
          • Meta Messages
            • Progress Bar Message
          • Attribute Message
      • Webchat Interface design
        • Webchat Interface Settings
        • Webchat Controls
      • Accessibility
      • Inclusive design
    • Leveraging Generative AI
      • Language Services
        • Semantic Intent Classifier
          • OpenAI
          • Azure
          • Google Gemini
          • Output attributes
        • Retrieval Augmented Generation
        • Example-based intent classification [Deprecated]
      • Interpreters
        • Available interpreters
          • OpenDialog interpreter
          • Amazon Lex interpreter
          • Google Dialogflow
            • Google Dialogflow interpreter
            • Google Dialogflow Knowledge Base
          • OpenAI interpreter
        • Using a language service interpreter
        • Interpreter Orchestration
        • Troubleshooting interpreters
      • LLM Actions
        • OpenAI
        • Azure OpenAI
        • Output attributes
        • Using conversation history (memory) in LLM actions
        • LLM Action Analytics
    • 3rd party Integrations in your application
      • Webhook actions
      • Actions from library
        • Freshdesk Action
        • Send to Email Action
        • Set Attributes Action
      • Conversation Hand-off
        • Chatwoot
    • Previewing your application
    • Launching your application
    • Monitoring your application
    • Debugging your application
    • Translating your application
    • FAQ
    • Troubleshooting and Common Problems
  • Developing With OpenDialog
    • Integrating with OpenDialog
    • Actions
      • Webhook actions
      • LLM actions
    • WebChat
      • Chat API
      • WebChat authentication
      • User Tracking
      • Load Webchat within page Element
      • How to enable JavaScript in your browser
      • SDK
        • Methods
        • Events
        • Custom Components
    • External APIs
  • Release Notes
    • Version 3 Upgrade Guide
    • Release Notes
Powered by GitBook
On this page
  • What is a date picker message?
  • When to use a date picker message?
  • How to create a date picker message
  • 1. Creating a date picker message on an application intent
  • 2. Setting up the corresponding user intent
  • How to construct a date picker message
  1. CREATE AI APPLICATIONS
  2. Designing your application
  3. Message Design
  4. Message Types

Date Picker Message

This page describe where to use and find a date picker message type

PreviousButton MessageNextAudio Message

Last updated 6 months ago

What is a date picker message?

Date picker messages allow the user to choose a date from a graphical calendar interface within the chat window which is then saved to an attribute for further use. Date picker messages simplify the process of inputting dates in a consistent format. This can often be challenging if you need to constrain the range of dates you would like to accept as input, or if you are serving an international user base with differing date formats.

As well as being able to just pick the date, the date picker message also has other options. For example:

  • The month + year option

  • The just-year option

  • The date + time option

  • The only-time option

When to use a date picker message?

There are many different times when a date picker could be useful to use in your OpenDialog chatbot. For example, when trying to schedule an appointment. The date picker message would allow your users to pick a date and time easily and efficiently.

Other examples on when to use this message type include booking reservations, setting reminders, and event registration. Also for inputting basic data or information, for example putting in date of birth.

How to create a date picker message

Date picker messages are set up by following two steps:

  1. Creating a date picker message on an application intent

  2. Setting up the corresponding user intent to move the conversation forward

1. Creating a date picker message on an application intent

  • In your scenario management, navigate to the application intent you wish to create the date picker message for.

  • In the yellow right-hand settings panel, view its basic settings.

  • Click on the 'Edit Messages' button in the Design from the right hand panel and select Messages

  • Go into the message that you want to add a message block to by clicking on its Edit icon (notebook with a pencil)

  • Select add a 'Custom Message' block

  • Select 'Date Picker' from the drop down

If you change your mind and select a different message type after generating the XML code, the new message code will be appended in the same window so make sure to delete the old message code.

XML Snippet

Remember to use only one of the options to indicate range.

<date-message>
  <text>Date Text</text>
  <callback>date_callback</callback>
  <submit_text>Date Submit Text</submit_text>
  <no_past_dates>true</no_past_dates>
  <no_future_dates>false</no_future_dates>
  <max_date>today</max_date>
  <min_date>2024-01-20</min_date>
  <attribute_name>date_attribute_name</attribute_name>
</date-message>

Each option from above has it's own unique line of code that will need to be added. All of the code you need is available to you blow:

For the time picker

<date-message>
  <format>only-time</format>
  <text>Date Text</text>
  <callback>date_callback</callback>
  <submit_text>Date Submit Text</submit_text>
  <no_past_dates>true</no_past_dates>
  <no_future_dates>false</no_future_dates>
  <max_date>today</max_date>
  <min_date>2024-01-20</min_date>
  <attribute_name>date_attribute_name</attribute_name>
</date-message>

For the date & time picker

<date-message>
  <format>date-time</format>
  <text>Date Text</text>
  <callback>date_callback</callback>
  <submit_text>Date Submit Text</submit_text>
  <no_past_dates>true</no_past_dates>
  <no_future_dates>false</no_future_dates>
  <max_date>today</max_date>
  <min_date>2024-01-20</min_date>
  <attribute_name>date_attribute_name</attribute_name>
</date-message>

For the year picker

<date-message>
  <format>only-year</format>
  <text>Date Text</text>
  <callback>date_callback</callback>
  <submit_text>Date Submit Text</submit_text>
  <no_past_dates>true</no_past_dates>
  <no_future_dates>false</no_future_dates>
  <max_date>today</max_date>
  <min_date>2024-01-20</min_date>
  <attribute_name>date_attribute_name</attribute_name>
</date-message>

For the month and year picker

<date-message>
  <format>month-year</format>
  <text>Date Text</text>
  <callback>date_callback</callback>
  <submit_text>Date Submit Text</submit_text>
  <no_past_dates>true</no_past_dates>
  <no_future_dates>false</no_future_dates>
  <max_date>today</max_date>
  <min_date>2024-01-20</min_date>
  <attribute_name>date_attribute_name</attribute_name>
</date-message>

To see the regular date picker, you can either not include the <format> tag at all, or you can add

<format>default</format>

Interaction with other message types

Properties

<text> is the title that appears at the top of the calendar. This could be Select Appointment or as simple as Date for example.

<callback> As with button messages, the callback parameter defines the user intent that is triggered when the user clicks the submit button. This should route the user to the next step in the conversation.

<submit_text> defines the text that appears on the button that advances the conversation.

To indicate range, use either <no_past_dates> and <no_future_dates> or <min_date> and <max_date> :

  • <no_past_dates> and <no_future_dates> take boolean values and narrow the scope of dates that are displayed to the user in the calendar. These allow you to constrain the range relative to "today".

  • <min_date> and <max_date> define the scope of available dates the user can select. The input format is YYYY-MM-DD ie. the 30th October 2019 would be 2019-10-30. The <max_date> is the last/most recent date the user can select.

<attribute_name> defines the attribute to which the chosen date is stored.

2. Setting up the corresponding user intent

In your XML you have set a callback parameter which defines the user intent to be triggered. This means that when the user will click on the 'Submit' button (button text defined in the <submit_text> parameter), the conversation engine will look for this callback intent in your conversation design setup.

To set this up, follow these steps:

  • In your scenario management, navigate to the scene of the application intent that you set the date picker message on.

  • Set the Priority Interpreter to 'OpenDialog' - Do not forget!

  • Create a 'Continue' Turn

  • Create a user intent corresponding to the callback from your XML snippet (by default this is 'Continue')

  • Set the interpreter to Default so that it will pick up on the OpenDialog interpreter you set on the Scene level.

  • From here, either set up a corresponding application response intent for your confirmation message or transition to a different part of the convrsation via a transition.

Saving a message: Always remember to hit 'Save Message' before closing or navigating away from the edit screen.

How to construct a date picker message

To enable these different options, you simply have to add another line of code into the XML that's available at the .

Update the XML to the you need for your use case

Date picker messages should come last in in your authored messages as the <submit_text> button advances the conversation. They can be combined with text, image and audio messages (seen in ).

When structuring a message, you are able to use multiple different message blocks together to create the message that you are looking for. However, when it comes to ordering and structing these, there are some rules that need to be followed. To learn more about this, please head to the page for more information.

For all message types, a key element to take into consideration is Accessibility, especially for messages that include customisation with multimedia types such as buttons, images and links. For all information on accessibility within OpenDialog, please click .

Constructing Messages
here
bottom of the page
XML format
this example
Users are prompted with a clickable input box.
When clicked, a calendar appears
Pick a time
Pick a date and time
Pick a month and year
Pick a year
How to create a date picker message in the custom message block