Pass logged-in user data to an embedded Fillout form

Ask the community
,
1

Hello!
I currently pass data successfully to my Fillout forms through the URL.
Here is an example: https://forms.homehealthwork.com/t/hwVKArU6HLus?user_id=xxxxx&agency_id=xxxxx
In this example I populate the user_id and agency_id from my Airtable base, using the ID field in the USER table and ID field in the AGENCY table.

However, I would like to now embed this Fillout form on a Softr page, and pass the user_id and agency_id using the Custom Code Block on my Softr page.

I attempted it with the following lines in the Custom Code Block, but can’t seem to do it correctly.

<div class="w-400 text-center"><p class="h6">
    <script>
        let filloutUrl = 'https://forms.homehealthwork.com/t/q4qQWTmCP5us';
        if(window['logged_in_user'] && window['logged_in_user']['airtable_record_id']) {
            filloutUrl = filloutUrl + '?record_id=' + window['logged_in_user']['airtable_record_id'] +'&agency_id=' + window['logged_in_user']['agency_id'];
        }
        document.write('<iframe src="' + filloutUrl + '" width="100%" height="2000" frameborder="0" marginheight="0" marginwidth="0" title="My Application"></iframe>');
    </script>
</p></div>

And here is a copy/paste from the Fillout embed code generator:

<iframe
  src="https://forms.homehealthwork.com/t/hwVKArU6HLus?record_id=xxxxx&agency_id=xxxxx"
  width="100%"
  height="2000px"
  frameborder="0"
  marginheight="0"
  marginwidth="0"
  title="Agency Work Agreement"></iframe>

Any help would be greatly appreciated!

2

I can’t be sure of this, so please take it as a suggestion to try, not necessarily a solution:

Create an Airtable formula field that uses the Fillout Form code to create dynamic code … particularly with attention to this line:

src="https://forms.homehealthwork.com/t/hwVKArU6HLus?record_id=xxxxx&agency_id=xxxxx"

where you insert after the ? & ‘record_id=‘ & {record_id} & ‘agency_id=‘ & {agency_id} & ‘“‘

(You may need to use Airtable’s encode URL wrap-around too)

Then, use a dynamic block on your page, with a Custom Code field that references the formula field that contains all of the code, as described above.

I hope that helps you in some way, even if it prompts other people to contribute different approaches to give you a working solution.

1 Like
3

Thanks for the response Mark, that definitely worked. I would have never thought to use an embed field itself as a solution, so I appreciate the suggestion! Just kinda always thought of fields as containers for one specific data type, but makes sense not to impose that limitation if not necessary.

1 Like
4

@MarkSchofield @robot_computer … would either of you have screenshots on how you make this work in Airtable and in Softr. I want to do the same things you suggest but I just can’t seem to land it.

I am not sure which dynamic block get’s used to pull through embedded code. I am also trying to figure out how to drop embed code into a formula field as I can only seem to figure out how to drop a URL into the field.

Appreciate any guidance or advice. Thanks!

1 Like
5

Fillout has a support article built out for this here: How to embed Fillout forms in Softr