Forum Academy Marketplace Showcase Pricing Features

Using dropdown to lookup and populate a text box?

Hi Bubblers,

I’m new here and have been scouring the forums for an answer to this question – without success.

I’d like to create a dropdown where the user chooses an item from a dropdown and then the app populates some text boxes based on that choice.

For example

CREATURE (DROPDOWN)

  • Monkey
  • Butterfly
  • Salmon

Once the user makes the choice with the dropdown, the program populates some text boxes

For example, if the user chooses MONKEY
these two text boxes might be populated like this

TYPE: mammal
LOCOMOTION: swinging

For the BUTTERFLY choice it would look like this

TYPE: insect
LOCOMOTION: flying

So I am guessing I need some data in the database for a CREATURE Thing with fields NAME, TYPE, and LOCOMOTION

I just can’t figure out how to use the dropdown to make a choice and do a look-up and populate function.

Any help would be massively appreciated.

Thanks

Randy

First of all - that is a great owl pumpkin picture. Love It!

If you create a workflow for your dropdown that says:

When this drop-down’s value is not empty - set state of (group of text boxes) to: dropdown’s value.

So basically - if you have the text boxes in a group. You would set the data source of the group to a “set state” - like:
Data source = Parent groups (dropdown selector) <- dropdown selector is the “state”

So when a user selects an item in the dropdown - it will set the state of your group (with the textboxes) to correlate with the selection; than populate the data accordingly.

There’s likely some additional steps; but that’s the general idea. Does that make sense??

1 Like

Thanks Jordan

I gave that a try but got stuck on the “set state” step.

https://dropdown-test.bubbleapps.io/version-test/index?debug_mode=true

Thanks for your help!

PS The owl is actually one of my dog’s toys – but he reminds me of my quest for knowledge :slight_smile:

Ah ya that’s great! From the look on that owls face; he’s “seen it all.” Wise indeed!

So I am playing around with a different way (does not require “set state”)

it is here in the forum app https://bubble.io/page?type=page&name=dropdown&id=forum_app2&tab=tabs-1

If you click preview; the sequence does “work” if you click on one of the values in the dropdown, but the drop-down values are invisible :confused: which obviously wont work… (I am trying to populate the drop-down with animal “names”)

  • Anyway the solution is right around the corner, so its worth clicking around with on your end - to see what I’ve done.

I’m actually quite bad at structuring forum app data. Perhaps @cakeheke can have a look? (cakeheke is really good with the forum app, and also has a great screaming tiki profile pic :wink: )

  • I will fiddle around with it again tomorrow; if it hasn’t been resolved.

Cheers

  • Jordan

Sounds a lot like …

https://buildingonbubble.com/block/dynamically-filter-a-list-1458840720641x659248893977690100

2 Likes

Yes! Nice Nigel, very nice. The link right to the editor from buildingonbubble is great.

Do check that out @bogwood; perhaps buttons for the animals could be a better way…?

You could also have buttons FOR the buttons (another set state sequence). For example “Forest animals” would show a group of buttons that say “Raccoon” “Birds” etc - another layer of categorization (particularly if you have lots of animals)

Sorry I couldn’t figure out the dropdown - I have yet to successfully populate one with dynamic data. You could likely do it with static data - but that would involve you needing to type the animals names (the same) in several different places, multiple times…

Thanks Jordan – I learned a lot from your example – especially the fact that text boxes can be calculations (Name = Parent Group’s Animal’s Name)

I just need to figure out that pesky dropdown

Nigel, thanks for pointing me to that BuildingOnBubble example. I’ll dig into it and see if I can adapt that for my purpose

Jordan,

SOLVED!

Your solution is perfect with this minor tweak:

This causes the dropdown’s selection to be visible.

Thanks again!

3 Likes

Gawh! Of course! :slight_smile: I should have known; but did not even think of, or try that! Good to see you have found the solution.
(Thanks for the screenshot/ I learned something here; as will others)

Cheers

Newbie here! This is exactly what I need but in reviewing the forum_app2, I don’t see how you created the “animals” option for Types of Choices. Is there an article or reference explaining the part of it? This will pretty much make up my entire form so important haha. I would appreciate any help!

SOLVED: Of course I pulled the trigger to soon on asking. For those that are asking the same
1.) Go to the Data module on the left hand side and in the Data Type tab create a new Data Type with the name of ‘Animals’ in this case
2.) Within your new data type add the fields for “Animal”, “Kind”, “Locomotion”, “Name”
3.) App Data Tab> New Entry> Add the name of the animal you want to include, and the associated information for the other three data fields you created and are intending to autopopulate. Add a new entry for each animal.

This will provide you with the option to include “Animals” for your type of choices and follow the rest of the settings laid out by Jordan & Bogwood. Thanks for the input guys!