How to Disable Button after single use in a adaptive card

问题

I am using adaptive card in my LUIS agent. I want if a user has filled the details in an adaptive card after that the submit button should get disabled. And also i would like to know that how to hide a button when we are displaying a nested adaptive card on a button click

I have tried validating the card using the values input given by the user. But i am looking for a better and more optimal solution for this

p.s working on bot framework v4 API

回答1:

In a channel like Teams, your bot can call the update activity API and edit the card in the conversation history that way. Web Chat does not support updating or deleting activities out of the box, but if you fork the Web Chat repo you can modify it to do whatever you want. This is essentially the same as creating your own Direct Line client while using Web Chat as a starting point.

For clarity, I want to briefly mention that Web Chat is not really a channel. Direct Line is the channel, and Web Chat is a Direct Line client. The client application is what is ultimately responsible for rendering cards and handling their interactivity.

There is a way to effectively disable Adaptive Card submit actions in any channel using bot state. If you put identifying information in the submit action's data, then you can have your bot remember that the button has already been clicked. If you make sure the bot doesn't do anything when the button is clicked again then it's effectively disabled even though it doesn't look any different.

If you're interested in more Adaptive Card functionality becoming available as a NuGet package, please show some support for my Bot Builder Community idea. If you would like to understand more about using Adaptive Cards with the Bot Framework in general then have a look at my latest blog post.

回答2:

In webchat, hiding/disabling submit button can be handled in "Incoming Activity" event of Azure bot. You can get 'your_submit_button_id' from JSON file of adaptive card.

const store = window.WebChat.createStore(
    {},
    function (_ref) {
        const dispatch = _ref.dispatch;
        return function (next) {
            return function (action) {
                if (action.type === 'DIRECT_LINE/CONNECT_FULFILLED') {
                    dispatch({
                        type: 'WEB_CHAT/SEND_EVENT',
                        payload: {
                            name: 'webchat/join',
                            value: { language: window.navigator.language }
                        }
                    });
                }
if (action.type === 'DIRECT_LINE/INCOMING_ACTIVITY') {
        const event = new Event('webchatincomingactivity');

        event.data = action.payload.activity;
/* hiding/disabling button code starts here */
    if(event.data.value!=undefined && event.data.value.id=='your_submit_button_id')
    {
     var btnArr=document.getElementsByClassName("ac-pushButton");
     btnArr[btnArr.length-1].style.display='none';

             //btnArr[btnArr.length-1].disabled = true;
    }
        window.dispatchEvent(event);
    }
                return next(action);
            };
        };
    });

来源：https://stackoverflow.com/questions/57766022/how-to-disable-button-after-single-use-in-a-adaptive-card

标签

botframework

adaptive-cards