Skip to main content

Form JSON Code

This section provides JSON code examples for the different components of a Retorik Studio Form, as documented in the Forms section.

Form components​

Section​

Code
{
    "$type": "K2.Bot.Forms.Models.Section, K2.Bot.Forms",
    "Introduction": "Start of form",
    // Set to Null if the intro message is handled by a standalone Sentence display component
    // independent of the section.
    "Title": "",
    "AskToBegin": false,
    "StopFormsIfLaunchRefused": false,
    "ForceLaunch": false,
    "AskToBeginSentence": null,
    "MessageIfLaunchRefused": null,
    "Items":[
                //Insert the JSON code of each form component here
    ],
    "Choices": {},
    "LocalizationContainer": {},
     "Identifier": "1",
    "NextItemIdentifier": null,   //A section can call another section
    "GoToIdentifier": null
    "Condition": null,            //A section can be conditioned by an expression
    "Validation": null,
    "DisplayExternal": true,
    "Value": null,
    "DefaultValue": null,
    "Locked": false,
    "ColumnPosition": 0, 
    "RowPosition": 0, 
    "SizePercentage": 0, 
    "Meta": null 
 }

Radio Button List​

Single-column radio button list​

Code
{
"$type": "K2.Bot.Forms.Models.Question, K2.Bot.Forms",
        "Text": "Here is an example of a single-column radio button list",
        "Speak": null,
        "RepromptInvalidText": null,
        "RepromptUnrecognizedText": null,
        "StoragePath": "Conversation.Patient.radioUniqueChoice", //Variable that stores the selected value
        "ForcePrompt": true,
        "ValidationButtonText": "Validate",
        "ValidationButtonPosition": "fullwidth",
        "ValidationButtonDisplay": "button",
        "ChoicesActions": {},
        "Choices": [
          "Choice 1",
          "Choice 2",
          "Choice 3",
          "Choice 4",
          "Choice 5",
          "Choice 6",
          "Choice 7"
        ],
        "ChoicesOrder": 0,
        "StyleChoice": 7,
        "QuizOption": null,
        "OutputFormat": 0,
        "Split": 0,
        "LocalizationContainer": {},
        "Identifier": "0.6",
        "NextItemIdentifier": "0.7",
        "GoToIdentifier": null,
        "Condition": null,
        "Validation": null,
        "DisplayExternal": true,
        "Value": null,
        "DefaultValue": null,
        "Locked": false,
        "ColumnPosition": 0,
        "RowPosition": 0,
        "SizePercentage": 0,
        "Meta": null
}

Two-column radio button list​

Same code as for a single-column list but the Split property changes:
** "Split": 2,**

Possible values for StyleChoice​

Code
    None = 0,
    Auto = 1,
    Inline = 2,
    List = 3,
    SuggestedAction = 4,
    HeroCard = 5,
    CustomListSelect = 6,
    CustomListRadio = 7
    /*
        * 1 : Auto : the bot chooses the most appropriate form based on the number of choices
        * 2 : Inline : all on a single line
        * 3 : List : numbered list
        * 4 : SuggestedAction : button list
        * 5 : HeroCard : buttons with text inside (like multiple FAQ choice)
        * 6 : CustomListSelect : dropdown list
        * 7 : CustomListRadio : list with radio buttons (single choice)
        */

Checkbox List​

Single-column checkbox list​

Code
{
       "$type": "K2.Bot.Forms.Models.CustomCheckboxInput, K2.Bot.Forms",
        "Text": "Here is an example of a single-column checkbox list",
        "Speak": null,
        "ListCheckBoxes": {
          "Choice 1": "Conversation.Patient.choice1_1", //Variable that stores the value of checkbox 1
          "Choice 2": "Conversation.Patient.choice1_2", //Variable that stores the value of checkbox 2
          "Choice 3": "Conversation.Patient.choice1_3", //Variable that stores the value of checkbox 3
          "Choice 4": "Conversation.Patient.choice1_4", //Variable that stores the value of checkbox 4
          "Choice 5": "Conversation.Patient.choice1_5"  //Variable that stores the value of checkbox 5
       },
        "ValidationButtonText": "Validate",
        "ValidationButtonPosition": "fullwidth",
        "ValidationButtonDisplay": "button",
        "Split": 0,
        "ForcePrompt": false,
        "LocalizationContainer": {},
        "Identifier": "0.1",
        "NextItemIdentifier": "0.2",
        "GoToIdentifier": null,
        "Condition": null,
        "Validation": null,
        "DisplayExternal": true,
        "Value": null,
        "DefaultValue": null,
        "Locked": false,
        "ColumnPosition": 0,
        "RowPosition": 0,
        "SizePercentage": 0,
        "Meta": null
}

Two-column checkbox list​

Same code as for a single-column list but the Split property changes:
** "Split": 2,**

Button List​

Single-choice button list​

Code
{
       "$type": "K2.Bot.Forms.Models.CustomButtonInput, K2.Bot.Forms",
        "Text": "Here is an example of a single-choice button list",
        "Speak": null,
        "ListButtons": {
          "Button 1": "",
          "Button 2": "",
          "Button 3": "",
          "Button 4": "",
          "Button 5": ""
       },
        "ValidationButtonText": "Validate",
        "ValidationButtonPosition": "fullwidth",
        "ValidationButtonDisplay": "button",
        "IsMultiple": false,
        "StoragePath": "Conversation.Patient.uniqueBtn",
        "ForcePrompt": false,
        "LocalizationContainer": {},
        "Identifier": "0.3",
        "NextItemIdentifier": "0.4",
        "GoToIdentifier": null,
        "Condition": null,
        "Validation": null,
        "DisplayExternal": true,
        "Value": null,
        "DefaultValue": null,
        "Locked": false,
        "ColumnPosition": 0,
        "RowPosition": 0,
        "SizePercentage": 0,
        "Meta": null
}

Multiple-choice button list​

Same code as for a single-choice button list but the IsMultiple property changes:
"IsMultiple": true,

Toggle Switch List​

Code
{
        "$type": "K2.Bot.Forms.Models.CustomToggleInput, K2.Bot.Forms",
        "Text": "Here is an example of toggle buttons",
        "Speak": null,
        "ListToggles": {
          "Choice 1": "*Conversation.Patient.choice3_1*",  // Variable that stores the value of button 1
          "Choice 2": "*Conversation.Patient.choice3_2*",  // Variable that stores the value of button 2
          "Choice 3": "*Conversation.Patient.choice3_3*",  // Variable that stores the value of button 3
          "Choice 4": "*Conversation.Patient.choice3_4*",  // Variable that stores the value of button 4
          "Choice 5": "*Conversation.Patient.choice3_5*"   // Variable that stores the value of button 5
        },
        "ValidationButtonText": "**Validate**",
        "ValidationButtonPosition": "fullwidth",
        "ValidationButtonDisplay": "button",
        "ForcePrompt": false,
        "LocalizationContainer": {},
        "Identifier": "0.5",
        "NextItemIdentifier": "0.6",
        "GoToIdentifier": null,
        "Condition": null,
        "Validation": null,
        "DisplayExternal": true,
        "Value": null,
        "DefaultValue": null,
        "Locked": false,
        "ColumnPosition": 0,
        "RowPosition": 0,
        "SizePercentage": 0,
        "Meta": null
}
Code
{
        "$type": "K2.Bot.Forms.Models.Question, K2.Bot.Forms",
        "Text": "Here is an example of a dropdown list",
        "Speak": null,
        "RepromptInvalidText": null,
        "RepromptUnrecognizedText": null,
        "StoragePath": "Conversation.Patient.selectList", //Variable that stores the selected value
        "ForcePrompt": true,
        "ValidationButtonText": "***Validate***",
        "ValidationButtonPosition": "fullwidth",
        "ValidationButtonDisplay": "button",
        "ChoicesActions": {},
        "Choices": [
        "Answer 1",
        "Answer 2",
        "Answer 3",
         "Answer 4",
         "Answer 5",
         "Answer 6",
         "Answer 7"
        ],
        "ChoicesOrder": 0,
        "StyleChoice": 6,
        "QuizOption": null,
        "OutputFormat": 0,
        "Split": 1,
        "LocalizationContainer": {},
        "Identifier": "0.8",
        "NextItemIdentifier": "0.9",
        "GoToIdentifier": null,
        "Condition": null,
        "Validation": null,
        "DisplayExternal": true,
        "Value": null,
        "DefaultValue": "Answer 6",
        "Locked": false,
        "ColumnPosition": 0,
        "RowPosition": 0,
        "SizePercentage": 0,
        "Meta": null
}

Image Selection​

Code
{
        "$type": "K2.Bot.Forms.Models.CustomImageChoiceSetInput, K2.Bot.Forms",
        "Text": "Which image do you prefer?",
        "Speak": null,
        "ValidationButtonText": "Validate",
        "ValidationButtonPosition": "fullwidth",
        "ValidationButtonDisplay": "button",
        "StoragePath": "Conversation.Patient.ImageSelection1", // Variable that stores the selected image value
        "IsMultiple": false,  // Set to true (multiple choice) or false (single choice)
        "SmallImages": true,  // Set to true or false as desired
        "ShowCaptions": true, // Set to true (captions visible) or false (captions hidden)
        "choicesWithUrl": [
          {
           "title": "Image1",   // Caption shown on screen if ShowCaptions is true
           "value":  "test1",   // Value retrieved by the variable defined by StoragePath
           "url": "https://picsum.photos/300/300.jpg",
           "LocalizationContainer": {}
          },

        //Repeat the JSON code for image 1 as many times as needed

        ],
        "ForcePrompt": false,
        "LocalizationContainer": {},
        "Identifier": "0.03",
        "NextItemIdentifier": "0.04",
        "GoToIdentifier": null,
        "Condition": null,
        "Validation": null,
        "DisplayExternal": true,
        "Value": null,
        "DefaultValue": null,
        "Locked": false,
        "ColumnPosition": 0,
        "RowPosition": 0,
        "SizePercentage": 0,
        "Meta": null
}

Date Selection​

Code
{
        "$type": "K2.Bot.Forms.Models.Input, K2.Bot.Forms",
        "Text": "What is your date of birth?",
        "Speak": null,
        "RepromptInvalidText": null,
        "RepromptUnrecognizedText": null,
        "StoragePath": "Conversation.Patient.Date", //Variable that stores the entered value
        "ForcePrompt": false,
        "**TypeInput": "DateWithPicker",
        "ValidationButtonText": "Validate",
        "ValidationButtonPosition": "fullwidth",
        "ValidationButtonDisplay": "button",
        "LocalizationContainer": {},
        "Identifier": "0.000011",
        "NextItemIdentifier": "0.0002",
        "GoToIdentifier": null,
        "Condition": null,
        "Validation": null,
        "DisplayExternal": true,
        "Value": null,
        "DefaultValue": null,
        "Locked": false,
        "ColumnPosition": 0,
        "RowPosition": 0,
        "SizePercentage": 0,
        "Meta": null
}

Time Selection​

Code
{
       "$type": "K2.Bot.Forms.Models.**Input**, K2.Bot.Forms",<br/>
        "Text": "What time did you arrive?",
        "Speak": null,
        "RepromptInvalidText": null,
        "RepromptUnrecognizedText": null,
        "StoragePath": "Conversation.Patient.Time",
        "ForcePrompt": false,
        "TypeInput": "Time",
        "ValidationButtonText": "***Validate***",
        "ValidationButtonPosition": "fullwidth",
        "ValidationButtonDisplay": "button",
        "LocalizationContainer": {},
        "Identifier": "0.001",
        "NextItemIdentifier": "0.002",
        "GoToIdentifier": null,
        "Condition": null,
        "Validation": null,
        "DisplayExternal": true,
        "Value": null,
        "DefaultValue": null,
        "Locked": false,
        "ColumnPosition": 0,
        "RowPosition": 0,
        "SizePercentage": 0,
        "Meta": null
}

Slider Scale​

Code
{
        "$type": "K2.Bot.Forms.Models.CustomSliderInput, K2.Bot.Forms",
        "Text": "On a scale of 1 to 10, how would you rate your pain?",
        "Speak": null,
        "MinLabel": "1",
        "MaxLabel": "10",
        "MinValue": 1,
        "MaxValue": 10,
        "ValidationButtonText": "Validate",
        "ValidationButtonPosition": "fullwidth",
        "ValidationButtonDisplay": "button",
        "StoragePath": "Conversation.Patient.Slider",
        "ForcePrompt": false,
        "LocalizationContainer": {},
        "Identifier": "0.01",
        "NextItemIdentifier": "0.02",
        "GoToIdentifier": null,
        "Condition": null,
        "Validation": null,
        "DisplayExternal": true,
        "Value": null,
        "DefaultValue": null,
        "Locked": false,
        "ColumnPosition": 0,
        "RowPosition": 0,
        "SizePercentage": 0,
        "Meta": null
}

Likert Scale​

Code
{
      "$type": "K2.Bot.Forms.Models.CustomLikertInput, K2.Bot.Forms",
        "Text": "What rating would you give this application?",
        "Speak": null,
        "RatingMin": 1,
        "RatingMax": 5,
        "Emojis": [
          "🟊"
        ],
        "StrokeColor": "#ffae00", // Yellow by default
        "ValidationButtonText": "Validate",
        "ValidationButtonPosition": "fullwidth",
        "ValidationButtonDisplay": "button",
        "StoragePath": "*Conversation.Patient.Likert*",
        "ForcePrompt": false,
        "LocalizationContainer": {},
        "Identifier": "0.02",
        "NextItemIdentifier": "0.03",
        "GoToIdentifier": null,
        "Condition": null,
        "Validation": null,
        "DisplayExternal": true,
        "Value": null,
        "DefaultValue": null,
        "Locked": false,
        "ColumnPosition": 0,
        "RowPosition": 0,
        "SizePercentage": 0,
        "Meta": null
}

Display a message​

Code
{
    "$type": "K2.Bot.Forms.Models.Sentence, K2.Bot.Forms",
    "Text": "Hello ${turn.activity.from.name}, my name is Digital Assistant Name.",
       // The variable ${turn.activity.from.name} retrieves the user's first name.
    "Speak": null, // Leave as Null if no voice adjustment is needed
    "LocalizationContainer": {},
    "Identifier": "0.10",
    "NextItemIdentifier": "0.11",
    "GoToIdentifier": null,
    "Condition": null,
    "Validation": null,
    "DisplayExternal": true,
    "Value": null,
    "DefaultValue": null,
    "Locked": false,
    "ColumnPosition": 0,
    "RowPosition": 0,
    "SizePercentage": 0,
    "Meta": null
}

Display a message with action button​

Code
{
        "$type": "K2.Bot.Forms.Models.Question, K2.Bot.Forms",
        "Text": "Thank you for taking the time to answer these questions.",
        "Speak": null,
        "RepromptInvalidText": null,
        "RepromptUnrecognizedText": null,
        "StoragePath": "Conversation.Patient.end",
        "ForcePrompt": false,
        "ValidationButtonText": "Save",
        "ValidationButtonPosition": "fullwidth",
        "ValidationButtonDisplay": "button",
        "ChoicesActions": {},
        "Choices": [
          "Continue"
        ],
        "ChoicesOrder": 0,
        "StyleChoice": 5,
        "QuizOption": null,
        "OutputFormat": 0,
        "Split": 1,
        "LocalizationContainer": {},
        "Identifier": "0.37",
        "NextItemIdentifier": "0.99",
        "GoToIdentifier": null,
        "Condition": null,
        "Validation": null,
        "DisplayExternal": true,
        "Value": null,
        "DefaultValue": null,
        "Locked": false,
        "ColumnPosition": 0,
        "RowPosition": 0,
        "SizePercentage": 0,
        "Meta": null
}

Numeric or alphanumeric input​

Code for numeric input
{
        "$type": "K2.Bot.Forms.Models.Input, K2.Bot.Forms",
        "Text": "What is your height?",
        "Speak": null,
        "RepromptInvalidText": null,
        "RepromptUnrecognizedText": null,
        "StoragePath": "Conversation.Patient.length", // Variable that stores the entered value
        "ForcePrompt": false,
        "TypeInput": "Number",
        "ValidationButtonText": "false",
        "ValidationButtonPosition": "fullwidth",
        "ValidationButtonDisplay": "button",
        "LocalizationContainer": {},
        "Identifier": "0.0002",
        "NextItemIdentifier": "0.000211",
        "GoToIdentifier": null,
        "Condition": null,
        "Validation": null,
        "DisplayExternal": true,
        "Value": null,
        "DefaultValue": null,
        "Locked": false,
        "ColumnPosition": 0,
        "RowPosition": 0,
        "SizePercentage": 0,
        "Meta": null
}

Calling a form​

Copy this JSON call code into the area named JSON of the element to send at the end of the form:

Code
[
  {
    "$type": "K2.Bot.Forms.Models.Event K2.Bot.Forms",
    "Name": "FormEvent",
    "Payload": {
      "event": {
      "type": 0,
      "formId": "*Form name",
      "sectionId": "0"  //ID of the starting element in the called form
      }
    },
    "StopForm": true,
    "StopSection": false,
    "IsInnerEvent": true,
    "IsWaitingEvent": false,
    "WaitingEventName": null,
    "LocalizationContainer": {},
    "Identifier": "990",
    "NextItemIdentifier": "991",
    "GoToIdentifier": null,
    "Condition": null,
    "Validation": null,
    "DisplayExternal": true,
    "Value": null,
    "DefaultValue": null,
    "Locked": false,
    "ColumnPosition": 0,
    "RowPosition": 0,
    "SizePercentage": 0,
    "Meta": null
  }
]

Starting a form via the bot​

Code
const customActEvent = new CustomEvent("retorikSendActivity", { 
      detail: {
      type: "event",
      name: "StartFormEvent",
      value: {
        type: 0,
        formId: "Form name",
        sectionId: "0",
      },
    },
  });
  document.dispatchEvent(customActEvent);