Just published this tiny plugin called Air Static Dropdown labels, that i think some few people might find useful.
This plugin allows you to display dropdown labels different from the values when using the default bubble dropdown with the static option.
For dynamic choice you can simply use the features available in the default dropdown element.
If you want to have a dropdown with lables different from values, in most cases you create these as two different fields in your database and use the dynamic choice for the dropdown.
But there are cases that some developers want to use static choices for whatever reason.
Especially if you know your list is never going to change and therefore want to save your application from making a server side call to pull the list from the database.
This is where this plugin comes in handy.
Its very very tiny purely written in like 10 lines of javascript code so doesnât really add any overhead to your app.
Here is a demo link:
And the editor link:
Usage Instructions
Install the plugin
Add the element AirDropdownLabels to your page.
Assign a unique id attribute to your original dropdown element
(If you havenât already done so go to Settings page, General tab and check Expose the option to add an Id Attribute ...)
Enter this same id in the AirDropdwonLabels Element id field.
Enter the list of texts you want the dropdown to display. Must correspond the the values in the dropdown and should be the same length.
If you checked âThis input should not be emptyâ on the dropdown, check the same property on the AirDropdownLabels (this is important or some cats will die, seriously ).
Note: As usual if you have multiple dropdowns make sure each of the id attribute values are different.
@seanhoots Hey man! Love your plugin. But, one thing I am running into is that if I use it in a repeating group, the top item will have it replace the options correctly, but the other items will show my original dropdown instead of the values stored in your plugin. Any ideas?
You might have a problem with the ID attributes. Each one should have a unique name.
You can use the cell number to get unique names for each dropdown and the plugin elements.
Hi @seanhoots, your plugin works perfectly with bubble dropdowns. However, it seems not to work with multidropdowns.
I canât conditionally change the option caption of the multidropdown, hence impossible to handle multi-language. I tried regex, but only allows me to access âcurrent optionâŚâ, canât access current userâs language. Do you know of any alternative to this limitation ?
Thought of building a multidropdown myself with repeating group but the formating will be disgustingâŚ
Hi @akrylov, I did find a way to handle that. I have been rethinking the whole multi-language issue using REGEX. It requires to create a pattern in the databaseâs text field where you store your multidropdown options.
Example, if your multidropdown Searches for text in Type XXXX, instead of having one field per langue that you conditionally pick depending on the userâs language, just have ONE field with your text pattern.
Example:
/english:hello/french:salut/italian:ciao/ is what your text needs to look like (donât forget the â/â at beginning and end for REGEX extraction pattern to work).
Then use extract with regex function after the âsearch forâ function as in below screenshot
@formatusdesigner Yes, I did. Seanâs response was correct⌠The IDs have to be unique. So youâd use a dynamic statement in the ID for the element to make it reference the index of the repeating group.
For what itâs worth, I ended up replacing this functionality entirely with custom states since you can add an attribute to custom states. For instance, a field to display and a field that stores the actual value. Works better / faster.
Youâll want the dropdown and the plugin in the same cell of the repeating group. Youâll give them both IDs like you did, but youâll also use a dynamic reference to their index from the repeating group. (Screenshot below) This basically means that even though youâll have many copies on the same page, they will each have a unique ID from the others since each instance of the dropdown and the plugin will have a different index.
Hi @Andrew.Vernon , I have troubles getting the plugin to work currently.
So your solution with custom states sounds very good.
Any way you can share how youâve set that up?
Kind regards,
Sando
Sure thing! For this, youâll want an option set with atleast one attribute. So, your dropdown might show the âdisplayâ of the option set as the option to the user. But when you save that to the database, you might actually reference and save the attribute of the option instead of itâs display value.
Hereâs an example, letâs say you have a dropdown that asks someone to pick from a list of colors to customize their account in your app. Your option set might be a list of color options like Blue, Orange, Red, etc. But, you might want to save the attribute of each option which could have the hex value for the color.
Im still trying to understand how this works and i feel like this will solve my problem with my app. So i have a multilanguage option (English & Japanese) and with dropdowns, its a pain when handling them.
I use dynamic options for most of my dropdown options then use conditions to display to English when it detects the userâs language is Japanese or manually selected.
So when i tried testing the plugin when i checked the dynamic option, it just showed undefined. Am i doing something wrong?
Can you please share more details and screenshots of your setup, explaining how exactly you are using the Air Static Dropdown Labels Plugin?
The main pluginâs purpose is to assign labels to dropdown options. For instance, if you have a dropdown with static options 1,2,3, and the AirDropdownLabels plugin element on the page with the labels First, Second, Third â You Dropdown will display all three labels instead of showing 1,2,3 numbers.
See the screenshots below:
Hi.
Thanks, great job! It helped me as well.
But I encountered a problem:
In my app I have an âedit locationâ page. In this page there are many dropdowns, whose initial value AND placeholders are the previously chosen values and placeholders. So, for example, thinking of airbnb, you posted a house with KINGsize beds in a dropdown. Then you want to edit this number and are led to a page which has as default value the KINGsize" in the dropdown for the beds.
I used your wonderful plugin but it doesnĂ t seem to work. I.E. As long as there is a placeholder and-or initial content, the choices in the dropdown cannot be TRANSLATED, is this right?
).
