Dynamic Dependant Dropdown Menus

Ah. Ok. So you want it to cascade in all directions! Forward, backward, from the middle, etc. I’ll be following along to see you accomplish it.

1 Like

Lol, i hope so, if I come right on this one I will buy myself a gold star to stick on my forehead.

There is hope with Patrick reading all this as well as Hyperbytes who is also going to give it a go as well as Drymetal who is busy pulling his hair out on the same issue but with his own project. Between all of us I would imagine we should get there.

I got it to work. But the issue is that you have to choose the original option before it will show all options again. See video. Due to scaling on my laptop, my mouse is slightly above whatever I’m actually doing in the video. The screencapture isn’t scaling. (In case you wonder why I’m clicking above everything.)

EDIT: I tried adding a button, and put onClick, set the value of all the select menus to ‘’. That worked. However, each select only had the previous option until you choose that, and then choose the default again. The reason for this is because the data view isn’t being reset. Not sure how to do that.

If you use such large dataset then it is indeed better to do it server-side. Do it as you already doing it, but don’t make the selects depend on each other.

1 Like

Try setting the “Selected Value” to it’s own value. This should prevent the select from resetting after you’ve changed one of the three select.

I’ve reconstructed your database and came to the same problem. After figuring out the select doesn’t reset by feeding it’s own value I had the problem that continent and country showed each entry multiple times. But as I understand it, this matter you’ve already figured out. I guess there is no way to solve this with a single query.

However, if I got this right, I don’t like the idea of your customer because after you selected country and city there is no way to select another continent since the select is reduced to the matching continent. So you have to reset the entire form.

The overall problem i have here is that i pretty much have to do it all server side as this database is a bit of a beast and only getting bigger each day.
The client wants to get things down as granular as they want, so sometimes they might want a list of all people from Germany on the list, and then other times they might want only people from Germany that are Hard Bounced.
The reason for this is because the display then shows a download csv button that needs to process only the records as they are displayed.

The only way i see of doing this is as Patrick suggested and to remove the functionality that makes the selects dependant, which in this case is quite a small set anyway so they must just choose what they need from each. They may land up with some pages not having any records but i might be able to get around that one i think.

The final idea i have could get quite messy but might just work, and that is to use a whole bunch of client side conditions, in other words if dropdown 3 selected and dropdown1 is “” and dropdown2 is “” then display a different select menu for dropdown1 and dropdown2 that has different conditions. Going to play a little and see if i can make that work easily without breaking future functionality.

That really might work but I agree, it’s messy. All the more I hope that you succeed!

Keep us posted since we might need it ourselves someday :slight_smile:

1 Like

When you don’t make the selects depend on each other you could also gain performance when you bundle all the 3 needed queries for the selects in 1 Server Connect. An other improvement would be to not getting the results record directly on load, but only after the user clicks a button to retrieve the data.

1 Like

Drymetal just reminded me of something that I tend to overlook, not everything has to give the client an instant ajax type response, where major functionality is more important than anything else sometimes it is just as good to rather let them make their choices and submit their query to get a response.

So I have a very simple solution, just wrap all the selects in a form with their own dependancies and allow the user to submit to get the data back rather than trying to show the result of every change in real time. This will even allow me to add further functionality that might be greatly needed.

I will let you guys know how i go. Thanks for everyone giving feedback and advice.

1 Like

Has anything changed with how these work in newer versions of Wappler. I am unable to get these dynamic dropdown to work using the methods outlined above.

That’s a 3 years old topic :slight_smile:
Maybe just post a new topic explaining your question there and what exactly are you trying to achieve.