如何使用Watson Conversation Dialog创建表单构建器 [英] How to create a form builder with Watson Conversation Dialog

问题描述

我正在开展一个Watson Conversation项目。
我导入了以下Watson项目，我正在通过我的对话进行配置：
https://github.com/watson-developer-cloud/car-dashboard

I'm working on a Watson Conversation project. I imported the following Watson project and I'm configuring it with my conversation: https://github.com/watson-developer-cloud/car-dashboard

我希望聊天机器人向用户展示复选框，包含用户必须选择的7个选项。一个选项中的每次单击都链接到对话框的一部分。
目前，我已将此文本插入对话框节点

I would like the chatbot to show the user a checkbox with 7 options that the user has to choose. Each click in one option is linked to a part of the dialog. At the moment, I have inserted this text into a dialog node

"Select:<br>
<select id='select' on select: 'select()'>
<option value='01' selected> Product 1 </option>
<option value='02'>Product 2</option>
</select>"	

我有以下情况

图片

尝试遵循本文（如何在Watson中使用Select Option会话）已写入复制index.js文件中的代码，该文件在我的项目中不存在。

Trying to follow this article (How use Select Option in Watson Conversation) has written to copy the code inside the index.js file, which in my project is not there.

问题是两个：
1）你怎么能有一个复选框而不是一个下拉菜单？
2）在项目的github页面上可以看到的层次结构文件中，输入建议的代码？

The questions are two: 1) how can you have a checkbox rather than a drop down menu? 2) In what file of the hierarchy you can see on the github page of the project, enter the suggested code?

推荐答案

正如@Arlemi指出的那样，您只能使用链接上提到的复选框代码。

As @Arlemi points out, you can use just the checkbox code mentioned on the link.

然而！您尝试做的事情的问题是，如果您尝试渲染其他系统，它将成为维护的噩梦。

However! The issue with what you are trying to do is that if you try to render for other systems, it will become a nightmare to maintain.

对话代码也有10MB的限制，因此添加无关代码会降低该限制。

Also there is a 10MB limit on conversation code, so adding extraneous code will lower that limit.

最好将代码分开，让应用层创建代码。

It would be better to separate the code out, and let the application layer do the creation of code.

例如，使用W3学校的链接代码：

For example, using the W3 schools link code:

<input type="checkbox" name="vehicle1" value="Bike"> I have a bike<br>
<input type="checkbox" name="vehicle2" value="Car"> I have a car<br>
<input type="checkbox" name="vehicle3" value="Boat" checked> I have a boat<br>

您将拥有如下对话节点。

You would have a dialog node like as follows.

{  "context": { 
  "vehicle_options": {
    "type": "checkbox",
      "options": [
        { "name": "vehicle1", "value": "Bike", "text": "I have a bike" },
        { "name": "vehicle2", "value": "Car", "text": "I have a car" },
        { "name": "vehicle3", "value": "Boat", "text": "I have a boat", "checked": true },
      ] 
  }
    },
  "output": {
      "text": {
        "values": [ "Select your Vehicles: <! vehicle_options !>" ]
        }
    }
}

您的应用层然后看起来对于<！ ！> 并使用此块内的值来确定要读取的上下文对象。它将使用类型值来确定渲染方式，并使用选项作为渲染的一部分。

Your application layer then looks for <! !> and uses the value inside this block to determine what context object to read. It will use the type value to determine how to render, and the options to use as part of that render.

这意味着您的应用程序层可以创建HTML或任何其他语言（例如Swift）。它还意味着您可以在其他地方控制样式，而不必更改对话响应。它还可以降低噪音，使维护/阅读更容易。

This means your application layer can create the HTML or any other language (eg. Swift). It also means you can control the styling elsewhere, and not have to change the conversation responses. It also reduces noise, making it easier to maintain/read.

这篇关于如何使用Watson Conversation Dialog创建表单构建器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！