How can I add the multi-turn prompt in the webchat?

Question

I added multi-turn prompts to my qna, and they work in the qna website, but when trying in the webchat the prompts don't show up.

Do they work in the webchat?

Answer 1

If you want to display the result as a card like the QnA test portal does, you need to convert the result to an Adaptive Card. See the code snippets below.

Screenshot

Bot Code - onMessage - Node

this.onMessage(async (context, next) => {

  const qnaResults = await this.qnaMaker.getAnswers(context);

  if (qnaResults[0]) {
      const { answer, context: { prompts }} = qnaResults[0];

      let reply;
      if (prompts.length) {

        const card = {
          "type": "AdaptiveCard",
          "body": [
              {
                  "type": "TextBlock",
                  "text": answer,
                  wrap: true
              }
          ],
          "actions": prompts.map(({ displayText }) => ({ type: "Action.Submit", title: displayText, data: displayText })),
          "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
          "version": "1.1"
        }

        reply = { attachments: [CardFactory.adaptiveCard(card)] };
      } else {
        reply = answer;
      }

      await context.sendActivity(reply);

  // If no answers were returned from QnA Maker, reply with help.
  } else {
      await context.sendActivity('No QnA Maker answers were found.');
  }

  await next();
});
}

Hope this helps!