0

您可以在自适应卡片中使用输入表单。但是我如何在不进入下一个对话框的情况下检查这些字段是否已填写。因此,在我单击提交按钮后,它应该检查字段是否已填写。

代码:nodejs

示例:http ://adaptivecards.io/samples/InputForm.html

4

2 回答 2

1

您可以验证输入并控制机器人应用程序中的对话水满。例如

var bot = new builder.UniversalBot(connector, [(session,args,next) => {

    if (session.message && session.message.value) {
        // A Card's Submit Action obj was received
        if (processSubmitAction(session, session.message.value)) {
            next(session.message.value)
        }
        return;

    } 
        // Display Welcome card with Hotels and Flights search options
        var card = {
            'contentType': 'application/vnd.microsoft.card.adaptive',
            'content': {
                "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
                "type": "AdaptiveCard",
                "version": "1.0",
                "body": [{
                    "type": "ColumnSet",
                    "columns": [{
                            "type": "Column",
                            "width": 2,
                            "items": [{
                                    "type": "TextBlock",
                                    "text": "Tell us about yourself",
                                    "weight": "bolder",
                                    "size": "medium"
                                },
                                {
                                    "type": "TextBlock",
                                    "text": "We just need a few more details to get you booked for the trip of a lifetime!",
                                    "isSubtle": true,
                                    "wrap": true
                                },
                                {
                                    "type": "TextBlock",
                                    "text": "Don't worry, we'll never share or sell your information.",
                                    "isSubtle": true,
                                    "wrap": true,
                                    "size": "small"
                                },
                                {
                                    "type": "TextBlock",
                                    "text": "Your name",
                                    "wrap": true
                                },
                                {
                                    "type": "Input.Text",
                                    "id": "myName",
                                    "placeholder": "Last, First"
                                },
                                {
                                    "type": "TextBlock",
                                    "text": "Your email",
                                    "value": "somevalue",
                                    "wrap": true
                                },
                                {
                                    "type": "Input.Text",
                                    "id": "myEmail",
                                    "placeholder": "youremail@example.com",
                                    "style": "email"
                                },
                                {
                                    "type": "TextBlock",
                                    "text": "Phone Number"
                                },
                                {
                                    "type": "Input.Text",
                                    "id": "myTel",
                                    "placeholder": "xxx.xxx.xxxx",
                                    "style": "tel"
                                }
                            ]
                        },
                        {
                            "type": "Column",
                            "width": 1,
                            "items": [{
                                "type": "Image",
                                "url": "https://upload.wikimedia.org/wikipedia/commons/b/b2/Diver_Silhouette%2C_Great_Barrier_Reef.jpg",
                                "size": "auto"
                            }]
                        }
                    ]
                }],
                "actions": [{
                    "type": "Action.Submit",
                    "title": "Submit"
                }]
            }
        };


        var msg = new builder.Message(session)
            .addAttachment(card);
        session.send(msg);


}, (session, results) => {
    session.send(JSON.stringify(results))
}]);

function processSubmitAction(session, value) {
    var defaultErrorMessage = 'Please complete all the search parameters';
    if (!value.myName) {
        session.send(defaultErrorMessage);
        return false;
    } else {
        return true;
    }
}

希望对您有所帮助。

于 2017-11-17T07:56:45.457 回答
0

自适应卡没有客户端验证,因此您必须从机器人服务中检索值并在服务器上进行验证。如果未按预期填写字段,则可以向用户发送回复,说明他们应填写的内容。查看此机器人以查看示例,完成对话框中的一些步骤以及何时提示输入,发送空白响应,机器人将回复友好消息,要求您填写字段。

http://contososcubabot.azurewebsites.net/

源代码:https ://github.com/matthidinger/ContosoScubaBot

于 2017-11-16T18:07:32.927 回答