CODEWITHSUNDEEP
node.jsbotframework
gpsugy
gpsugy

Reputation: 1279

How to Customize Prompt Choice (Microsoft Botbuilder SDK)

Note

I am using Microsoft Botbuilder SDK in node.js using ES6 babel.

The Problem

Based on this helpful StackOverflow post, https://stackoverflow.com/a/45597651/3304185, I am trying to modify the behavior of builder.Prompts.choice in the same way, to have more control over the retry prompt instead of defaulting to "I didn't understand." However, when I try to follow this implementation pattern and apply it to builder.Prompts.choice, I just get choices of undefined sent by the bot, like so:

Screenshot of Undefined Choices

Code

// snippet showing how I call the choice function, where
// welcome_subtitle is a string, and menuOptions is an array of strings
builder.Prompts.choice(session, welcome_subtitle, menuOptions, {
    listStyle: builder.ListStyle.button
});

builder.Prompts.choice = (session, prompt, choices, options) => {
    let args = options || {};
    args.prompt = prompt || args.prompt;
    args.choices = choices || args.choices;

    args.retryPrompt = args.retryPrompt || args.prompt;
    session.beginDialog('BotBuilder:prompt-choice', args);
}

Desired Behavior

I would have expected the choices to appear if I simply initialized args.choice to choices || args.choices, but that does not seem to be all that is necessary.

Thank you for any help you can give.

Upvotes: 2

Views: 1753

Answers (1)

Steven G.
Steven G.

Reputation: 1642

In this case passing in an array of strings will not work as it looks like the prompt is expecting a list of IChoice.

builder.Prompts.choice = (session, prompt, choices, options) => {
    let args = options || {};
    args.prompt = prompt || args.prompt;
    args.choices = choices || args.choices;

    args.retryPrompt = args.retryPrompt || args.prompt;
    console.log(args);
    session.beginDialog('BotBuilder:prompt-choice', args);
}

bot.dialog('/', [
    (session, args) => {
        welcome_subtitle = 'Hello Stack Overflow!';
        menuOptions = [{value: '1st Choice'}, {value: '2nd Choice'}, '3rd Choice', '4th Choice'];
        builder.Prompts.choice(session, welcome_subtitle, menuOptions, {
            listStyle: builder.ListStyle.button
        });
    },
    (session, results) => {
        session.endDialog();
    }
]);

Here's a screenshot with the console.log(args) inside builder.Prompts.choice and the emulator displaying the first two choices properly, but not the last two:

enter image description here

Upvotes: 1

Related Questions