[英]How send event from botframework v3 c# and listen at client side javascript using Direct Line?
How to disable user input by using disabled at wc-shellinput only when some event fires from MessagesController or from any dialog and enable it when desired action accomplished by user. 如何仅在某些事件从MessagesController或任何对话框触发时使用wc-shellinput处于禁用状态时禁用用户输入,并在用户完成所需操作时启用它。 What if I want to navigate web app during conversation with chatbot?
如果我想在与chatbot对话期间浏览网络应用程序,该怎么办? How this type of event handling possible?
这种类型的事件处理可能如何?
Here's how you can get it running, based off of this WebChat sample : 以下是基于此WebChat示例的运行方式 :
See this sample for more info. 有关详细信息,请参阅此示例 。
var message = context.MakeMessage();
To Disable Input 禁用输入
message.ChannelData = new { chatBox = "disable" }
To Enable Input 启用输入
message.ChannelData = new { chatBox = "enable" }
Send the message 发送消息
await context.PostAsync(message);
channelData.chatBox
(in index.html script tags) channelData.chatBox
创建事件(在index.html脚本标记中) const store = window.WebChat.createStore(
{},
({ dispatch }) => next => action => {
if (action && action.payload && action.payload.activity && action.payload.activity.channelData && action.payload.activity.channelData.chatBox) {
const event = new Event(`chatBox`);
event.data = action.payload.activity.channelData.chatBox;
window.dispatchEvent(event);
}
return next(action);
}
);
window.addEventListener('chatBox', ({ data }) => {
const chatBox = document.querySelector(`[data-id="webchat-sendbox-input"]`);
switch(data){
case 'enable':
chatBox.disabled = false;
break;
case 'disable':
chatBox.disabled = true;
break;
}
});
Enabled: 启用:
Disabled: 禁用:
Just be sure you ensure you re-enable it after disabling, as needed! 确保您确保在禁用后根据需要重新启用它!
It's pretty much the same thing. 这几乎是一回事。 You're reporting that BotChat isn't detecting all messages, so I used events instead.
您报告BotChat未检测到所有消息,因此我使用了事件。
Create/send events 创建/发送事件
var disable = new Activity()
{
Type = ActivityTypes.Event,
Value = new { chatBox = "disable" }
};
var enable = new Activity()
{
Type = ActivityTypes.Event,
Value = new { chatBox = "enable" }
};
await turnContext.SendActivityAsync(disable);
Listen for events in BotChat 在BotChat中收听活动
botConnection.activity$
.subscribe(function (activity) {
if (activity.type === 'event' && activity.value.chatBox) {
controlInput(activity.value.chatBox);
}
});
function controlInput(action) {
const chatBox = document.querySelector(`[class="wc-shellinput"]`);
switch(action) {
case 'enable':
chatBox.disabled = false;
break;
case 'disable':
chatBox.disabled = true;
break;
}
}
Note: If you're using the standard BotChat css, the input color doesn't change. 注意:如果您使用的是标准BotChat css,则输入颜色不会更改。 You'll need to add the css yourself.
你需要自己添加css。 Something along the lines of:
有点像:
input:disabled {
background-color: black !important;
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.