Give name to blank option in dropdown

Hello Bubblers!

I have an option set of colours which are blue, red and green. They are in a drop down and when selected are a search constraint.

There is a blank space above all of the three options and when selected all the colours show up which is what I want. The problem is I would like this blank field to be renamed as “All” so it is clear to the user.

Any ideas on how to do this?

Thanks!

Seeing as you’re using an option set, just create another option called ‘All’, put it at the top of the list and check the box for ‘This input should not be empty’.

Then just use a condition in your workflow action or datasources as required when that option is selected.

Hi Adam,

When I create another option called ‘All’, and check the box for ‘This input should not be empty’ It displays how I want it too but my search constraint is:

Set state of page index:
Do a search for “colour” with constraint of colour type = dropdown colour value.

When “all” is selected none of my items show up as they are only blue, green or red.

Is there a way to say if “all” is selected do a search for all colours? Is there a way to incorporate this into my original search constraint?

Thanks!

Hi Adam,

After doing a bit of searching I’ve come across an old post of yours, this looks like the solution! Please can you explain how you got “when this group is focused” ?

Thank you!

Put a condition, “When ‘All’ is selected”, set the Data source as a new “Do a search for…” , but now without any other constraints.

‘All options’ on Dropdowns - Need help - Bubble Forum

Hello Adam,

When I copy and paste the whole page directly from your link into my editor it works but when I want to implement the dropdown in my own index page it does not work.

This error message pops up on the index page only…
image

Any idea on why this is happening?

Thanks

I don’t know… did you copy the expression from the design tab?

I copied it from the workflow tab, how do you copy the expression from the design tab?

Edit: I tried to copy from the design tab using copy with workflows and paste with workflows but it still does not work :frowning:

you need to create the expression somewhere in the design tab (as it doesn’t let you create it in the workflow tab).

Then just copy and paste it into the only when condition for the workflow

Hi Adam, after some fiddling about I got it working!

I simply gave the dropdown(s) an ID attribute then I just ran some javascript!

// iterate over each dropdown ID
[“1223”, “1224”, “1225”, “1226”].forEach(function(dropdownId) {
// select the dropdown menu element using its ID
var dropdown = document.getElementById(dropdownId);

// get all option elements within the dropdown
var optionElements = dropdown.querySelectorAll(‘option’);

// update the text content of the second option element
if (optionElements.length > 1) {
optionElements[1].textContent = ‘All Options (this replaces the usual blank option)’;
}
});

I used chatbotGPT to edit your original code and it works somehow on mine now.

Thank you for your help!

1 Like

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