I have been trying to figure this out for a while and have looked through the forum and found similar posts but I just can’t quite crack it. I am trying to create a custom form where the city which a user selects from a dropdown determines the options for the next dropdown (areas of that city). I have this working fine so when a user selects a certain city, only the areas within that city are shown.
Now I want to make it so that these fields are required and to have a message pop up if they are not filled out (like in the form component) and then to only update and send the user to the next screen if all of the dropdowns are filled out.
Made some progress, used conditional visibility on groups to determine whether the button to progress/update user is visible. The little * which shows up when the field is empty works well apart from one issue.
When I chose an area which belongs to a city (good) and then change the change the city to a different one it clears the field for area (good) as I have it set to auto refresh when new item is added. However when this happens, the * does not appear to tell the user that the field is empty even though it is empty. Is there a way to do this?
But with more dropdowns = more actions which is not good for app performance. You could add visibility conditions to the button.
There’s a multi input validator component that will help here too. Do you want the *, to show after clicking the button or before without button going forward?
Ideally the * would show up after the button was pressed as I am also using the form component so I would need it as similar as possible to that.
The only issue I am really facing is that it seems like the dropdown automatically clears when the city for the selected area is no longer the same as the selected city, but it does not register that the dropdown is actually empty. (I want the dropdown to automatically clear)
I have true or false properties in my users collection for city field error, area error and sport error as these all can not be empty.
The * is then shown when logged in user city field error, area error or sport error is true for their respective locations.
The user updates based on whether the given field is empty or not, and it seems to register that the field is empty when it is automatically cleared, but it does not update the user so that area field error is true.
Do you think trying to change my set up so it is like that in his video would fix this issue?
Two solutions that comes to my mind is to use either the multi input validator component built by NoCode Monkey as the easiest solution or use inputs + select box component built by Adalomatic. (https://components.adalomatic.com/) I’ll let you know here if another idea comes in!
