Using botbuilder SDK's Prompt.choice(), is it possible to have a custom tooltip which displays long choice-text?

爱⌒轻易说出口 提交于 2019-12-29 09:32:10

问题


I am using NodeJS SDK for creating a bot using MSFT botframework. I am giving choice option to user using builder.prompt.choice. Is it possible to hover over the clickable options in case the option values are too long to be completely viewable? The code snippet is as follows. Also the options values are getting fetched at run time, so we do not have any control over the length.

function(session, args, next) {
  builder.Prompts.choice(session, "Please select one of the options:", ['I want to hover here.....', 'Since it is a very very long sentence', 'ccc ccc ccc dddd d  d aa a a ddd a sdd d '], {
    retryPrompt: "Invalid choice, Please pick below listed choices",
    listStyle: builder.ListStyle.button,
    maxRetries: 1
  });
},
function(session, results) {
  if (results.response) {
    //Do something
  }
}

回答1:


When using the Webchat channel, you can customize the channel implementation by following the guidelines provided on Microsoft's GitHub project here .

In particular, in your case you just need to remove a properties on the ActionButton that is limiting the buttons to 1 line, adding ... if the line is too long.

The modification that you have to do is to remove the following line on the function ActionButton in botchat.js file (looks like you can't simply do it on CSS side):

this._element.style.whiteSpace="nowrap";

By doing this you will have promptChoices like the following, where the 2nd choice has 2 lines:

By the way, you can also add a title to the buttons to get the value when hovering with the mouse like I have ;-)



来源:https://stackoverflow.com/questions/48018290/using-botbuilder-sdks-prompt-choice-is-it-possible-to-have-a-custom-tooltip

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!