How do I update or push a Slack modal view on submission? (Slack API w/ Bolt)

Viewed 2194

Modal fails to update or push the new view upon modal view submission. Slack's Bolt documentation only shows modal update or push through an interactive component. Correct functionality can be seen with the Giphy slack app.

Here's my code for the modal view I'm wanting to push:

app.action({'callback_id': 'gifsearchview_1'}, async ({ ack, body, context }) => {
   await ack();
   try {
     const result = await app.client.views.push({
       token: context.botToken,
       view_id: body.view.id,
       // View payload with updated blocks
       view: {
           // View identifier
           "type": "modal",
           "callback_id": 'gifsearchview_2',
               "title": {
                   "type": "plain_text",
                   "text": "Search Results",
                   "emoji": true
               },
               "submit": {
                   "type": "plain_text",
                   "text": "Submit"
               },
               "blocks": [
                   {
                       "type": "section",
                       "text": {
                           "type": "mrkdwn",
                           "text": "Updated."
                       },
                   }
               ]
         }
     });
     console.log(result);
   }
   catch (error) {
     console.error(error);
   }
 });
2 Answers

Can you post your error?

You are missing the trigger_id argument in the views.push call. See the Slack docs for that API. If you use the views.update (docs) call you can pass in the previous payload's view_id with the new view object.

As far as I know you can't use this method in a submit callback, instead you need to set the response_action and use the ack method passed in.

The documentation is very unclear on this, and I spent a day trying to make it work the way you describe to no avail (at least in a submit callback)

here is the general way: https://api.slack.com/surfaces/modals/using#pushing_response

Example:

let newView = {
      response_action: 'push',
      view: {
       "type": "modal",
       "callback_id": 'gifsearchview_2',
           "title": {
               "type": "plain_text",
               "text": "Search Results",
               "emoji": true
           },
           "submit": {
               "type": "plain_text",
               "text": "Submit"
           },
           "blocks": [
               {
                   "type": "section",
                   "text": {
                       "type": "mrkdwn",
                       "text": "Updated."
                   },
               }
            ]
        }      
    };
    await ack(newView);
Related