Wix Code gives you a lot of control over your dropdown lists and how they work with your data.
You can manually define the list labels (what your visitors see) and their values (the value you save based on their selection) in the Manage Drop Down List panel . But you can also automatically create a dropdown list from a field in your collection.
To do this, open the Connect to data panel for your dropdown and go to the Connect a List section. There are a few things to remember when you connect a dropdown list to your data.
The collection you use to maintain your dropdown list does not have to be the same collection you use to store your user data.
If you connect a dropdown list to your data it overrides the settings in the Manage Drop Down List panel. Also, both the labels and values of each item will be the same, based on your data. They cannot be set independently as you can in the Manage Drop Down List panel.
when connecting drop down to data set, the drop down shows the exact list in the data set. Sometimes the Data set is repeated and we only want to show the list in drop down without the repeated value
e.g
data set is city
list is
New York
Washington
Alabama
California
Washington
Washington
Washington
Alabama
the drop down will show as above but what we really looking to show is:
New York
Washington
Alabama
California
Unfortunately thereās no easy way to do what you are asking in the UI. You would have to use a fair bit of code to get that done. Briefly, you would need to query the collection for the field you want to use as your list, remove the duplicates from the results of that query, and then use that list as the dropdown options list .
In this scenario you arenāt using the feature as I described it above, you are using code to create the same effect. Let me know if you are interested in trying to implement this and if you need help.
Yes, Jeff that code snippet would be very helpful. It would be even neater if we could filter it based on another column value. So, show only cities and not states based on a separate column that identifies whether a given value is a city or a state.
Hey 3shtar and rsuri.1 take a look here for the code 3shtar asked for.
rsuri.1, I think this example is very close to what you want to accomplish. You just need to change the āifā to check the value in the other column you referred to, instead of it checking the other dropdown selection.
Just love the power of wix code. Just getting started. Trying to display a list of instructors in the Activities page on the Instructors Name dropdown.
Thank you Andreas.
I checked the permission settings for the Collection I wanted to display in the Dropdownā¦ and there it wasā¦
Permissions for Admin ONLY.
I changed it to ANYONE - now it is working!!
Thanx again.
Thank you so much for all the information you are giving. I have a search and two drop-downs to filter a gallery, search and first drop-down work, but the second one (categoria) doesnātā¦ It doesnāt return any resultsā¦ Would it be possible for you to help me?
Thanks in advance!
import wixData from āwix-dataā;
let lastFilterTitle;
let lastFilterUbicacion;
let lastFilterCategoria;
let debounceTimer;
export function iTitle_keyPress_1(event, $w) {
if (debounceTimer) {
clearTimeout(debounceTimer);
debounceTimer = undefined;
}
debounceTimer = setTimeout(() => {
filter($w(ā#iTitleā).value, lastFilterUbicacion);
}, 200);
}
function filter(title, ciudad, categoria) {
if (lastFilterTitle !== title || lastFilterUbicacion !== ciudad || lastFilterCategoria !== categoria) {
let newFilter = wixData.filter();
if (title)
newFilter = newFilter.contains(ātitleā, title);
if (ciudad)
newFilter = newFilter.eq(āciudadā, ciudad);
if (categoria)
newFilter = newFilter.eq(ācategoriaā, categoria);
$w(ā#dataset1ā).setFilter(newFilter);
lastFilterTitle = title;
lastFilterUbicacion = ciudad;
lastFilterCategoria = categoria;
}
}
export function iCity_change_1(event, $w) {
filter(lastFilterTitle, $w(ā#iCityā).value);
}
export function dropdown1_change(event, $w) {
filter(ācategoriaā, $w(ā#dropdown1ā).value);
}
I have implemented a dropdown using a database collection using the selection to filter a subsequent dropdown from another database collection. Iām using this to build a quote request. I want the user to be able to be able to make additional selections from the same drop downs. To make it clear to the user Iād like the dropdowns to revert to their placeholder text. I have not been able to figure out how to make this happen. It will occur when a user presses a button so I have an event handler to put the code in I just canāt figure out how to trigger the dropdowns to go back to their placeholder text. (Iād like the user to be able to reuse these dropdowns several times not just twice.)
@jeff-wix I have started building a fairly extensive database collection. However, is there a limit on how many entries will show in a drop down. After adding quite a bit to the database, finding that only a portion of the categories are showing up in the drop down menu???
While on topicā¦if a database is created say in Excel, and you edit and manipulate the order of items, etc. You then import the list to the Wix database, what will the order of items be in the database column in Wix?
Hey @jeff-wix , I am trying to setup a dynamic page that uses a dropdown menu to go to the different pages, Iām a little more than stuck. Iāve attached screenshots of what Iām trying to doā¦
The website layout (Excuse the mess, Iāve decided to redesign the whole website this time around corvid elements)
All of the posts Iāve looked at are older, and link to resources but it is difficult to understand without much explaination (as this is the best way for me to learn what I need to do in order to remember it for next time.)
It would be best if it was step by step with reasoning explained to make it as helpful as possible.
Please note that in this forum we do not provide custom coding solutions. If you feel like youāre struggling with code and canāt make it alone, please visit our WixArena where you can find pro designers and developers to help you build your site.
If you would like to try to figure this out yourself, you can look at these examples that demonstrate using Dropdown: