Creating an editable form

Hello Bubble Community,

I am a non-technical founder of a social startup. Been trying my best to learn what Bubble has to offer, in terms of building our MVP without any background knowledge of coding. So far it has been pretty easy to learn for the most part.

I am currently trying to create an ‘on-boarding’ page, where prospective users can tell us a bit about themselves. The goal was to have this be an editable working form that flows as part of several sentences. I have pasted below a draft of what we were considering using.

To the question: is there a way I can make those parenthesized areas clickable and editable by the users who are signing up? For the name entry, those could obviously just be fill in the blank, but the rest would require a drop down or something of the sort. I know I can create drop downs, but can they be implemented into the middle of a text flow, like in my example? If this will not work, can you suggest a more efficient approach? Any feedback would be greatly appreciated!

ABOUT YOU:

My name is [First name] [Last name].
I am [Age] [Gender], currently living in [Town/State].
I have [multiple jobs, one job, unemployed] as a [profession] making [income level] per year.
I am [Ethnicity] and I am [Religion]. I have completed [Education level].
My political views tend to be [Political leaning] and I am registered to vote as [Not registered, Political party].
I have [Military status]. I came to America [As a kid, as an adult, born here].

I would say most likely ‘no’ out-of-the-box, but maybe via another way. Bubble page elements are based around pixel perfect positioning. They can’t be positioned in-line with text. There are, of course, workarounds, but I don’t think the bubble dropdown you are used to would work the way you want.

If you wanted to do what you are looking for you could:

  • Try a 3rd party service like typeform to build your form and use the API to collect the data
  • build your form in HTML and insert the html code via an html block on your bubble page. Try to use a plugin or JS to target the IDs of your dropdowns (from your HTML block) and then save those values into bubble with a workflow.
  • create your own separate HTML page and code in dropdowns in line with text. Find a way to submit the results to your API workflow and store in the bubble DB
2 Likes

This topic was automatically closed after 70 days. New replies are no longer allowed.