Checked options from webview feeds flows

(Vila Vg) #1

hi there

i’m wondering if its possible to pull up a webview, have a user pick 2-3 checkboxes and then based on the inputs of the user, determine the next flow to trigger.

so if a user is looking to buy a product, they get asked “pick budget”, which triggers a webview with 4-5 different checkboxes representing the budget ranges ($10-20, $20-40, $50-80, $100+)

A user could pick one checkbox or multilple ones and depending on their choices, they get pushed to a specific flow.

Thanks!

(Daniel Beckett) #2

Hi Vila,

By webview do you mean opening up a new page for the user to input their answers, i.e. redirecting to another site? If so, that complicates things slightly. You could use the Webhooks & HTTP service to pass data back and forth from Flow XO but a much easier method would be to ask the questions inside your Flow.

Whilst we don’t support checkboxes or multiple choice you could use Bot > Ask a Question to ask users to pick a budget and then based on the response direct them to another Flow or even use labels and GoTo actions to jump to specific parts of the existing flow. You’d be able to use filters to control the actions based on user responses to your questions.

There’s a useful article on using filters over at our Flow XO Medium page if you’d like more info.

Hope that helps.

Thanks,
Dan

(Vila Vg) #3

Hi Daniel

What I meant is a way to pass data back from the Webview Form into Messenger and trigger a flow based on whether the data received from the webview contains specific keywords. How might this be possible to achieve?

(Sarah Palombo) #4

Hi Vila,
You’ll need to make sure that when using the webview, that messenger handle postbacks. - We need to receive a message back which will then trigger a flow (Keyword flow or a catch all). I can’t see any reference in facebooks documentation to say that this is the case? (I know this is the case with messengers generic templates but perhaps refer back to the docs on webview )
If not, you could call a webhook from the web view and trigger a flow using a webhook. (you might need to make sure you are passing through the response path if we’re triggering a new flow using a webhook) - Sarah

1 Like
(Vila Vg) #5

is there any example code and how to implement that code within flowxo? Any guidance of even a simple example would be super helpful. I can extrapolate that to a more layered example…
anks
Th

(Vila Vg) #6

@sarahpalombo any further inputs would be very helpful!

(Sarah Palombo) #7

Hi Vila.

You’ll always need to refer to messenger docs and take the specific examples there (there all slightly different depending what you want to do!)

The webview is opened from the persistent menu or A URL button inside a message - you will need to reference the generic template

Use our custom request and paste in the following

{
“attachment”:{
“type”:“template”,
“payload”:{
“template_type”:“generic”,
“elements”:[
{
“title”:“The bot platform for businesses”,
“subtitle”:“FOR MESSENGER, SLACK, SMS, TELEGRAM & WEB.”,
“image_url”:“https://res.cloudinary.com/crunchbase-production/image/upload/v1469783202/pynbvawzwqdyzkuoqrmn.png”,
“item_url”: “https://google.com”,
“buttons”:[
{
“type”:“web_url”,
“url”:“https://flowxo.com”,
“title”:“Get Started”,
“webview_height_ratio”: “compact”
}
]
}
]
}
}
}

This will show you the basic generic template with a button opening the webview. Further documentation on messenger can help you vary this example.

Hope that helps !

Sarah

(Vila Vg) #8

Hi Saran

I under stand how to get the Webview up. My query was about pushing data from within the webview back into messenger as a text conversation.

An example I found was like this.

  1. You fill a form in a Webview like so:
    https://s3.amazonaws.com/gs-bot-images/Guides+image/serverless-webviews-using-gupshup/flowGid.gif

and then those form inputs get pushed back into the Messenger conversation to then trigger a flow (see last msg):

(Source)

Any way to get this functionality setup in FlowXO?
Thanks!

(Sarah Palombo) #9

I’m not 100% sure ‘HOW’ unfortunately.

I understand that there would be 2 options.

  • Once your bot opens a webview. you’ll need to see if you can push data from within the webview back into messenger this would only be possible if messengers webview handle postbacks - perhaps refer to their docs ?

  • If not, you could call a webhook from the web view and trigger a flow using a webhook. (you might need to make sure you are passing through the response path if we’re triggering a new flow using a webhook)

It might be a solution but i thought i could provide some pointers :slight_smile:

Sarah

(Khashayar) #10

This could be done using Typeform, if Flowxo supported their Hidden Variables feature. No other form integration on Flowxo can pass identifying user data (ID or Response Path) to a form and have it be saved without the user knowing. Almost impossible to make complex forms now. This would be exasperated when the new persistent menu comes out, since users can’t put in any inputs then, unless you take them to webview

1 Like