I am trying to implement 3 level cascading dropdown fields. 'State' dropdown field will have choices based on 'country' selected and 'City' dropdown field will have choices based on 'State' selected. I have created choices for 'States' field using choose() function. But not sure how to create choices for 'City' field. It would be great if anyone can respond to this.
Note: I am using localVariables for all the data. Not querying to DB. This is only for testing purpose.
Discussion posts and replies are publicly visible
Hi Sudip
The key to this is the data model. You want to create data sets that can be related. There will be three sets of data:
Here's an example:
a!localVariables( local!countries: { {countryId: 1, countryName: "Australia"}, {countryId: 2, countryName: "United States of America"} }, local!states: { /* States of Australia */ {stateId: 1, countryId: 1, stateName: "New South Wales"}, {stateId: 2, countryId: 1, stateName: "Queensland"}, /* States of USA */ {stateId: 11, countryId: 2, stateName: "Alabama"}, {stateId: 12, countryId: 2, stateName: "Alaska"}, {stateId: 13, countryId: 2, stateName: "Arkansas"}, {stateId: 14, countryId: 2, stateName: "California"}, {stateId: 15, countryId: 2, stateName: "Colorado"} }, local!cities: { /* Cities of New South Wales, Australia */ {cityId: 1, stateId: 1, cityName: "Sydney"}, {cityId: 2, stateId: 1, cityName: "Wollongong"}, /* Cities of Colorado, USA */ {cityId: 12, stateId: 15, cityName: "Boulder"}, {cityId: 13, stateId: 15, cityName: "Denver"} }, local!selectedCountry: null, local!selectedState: null, local!selectedCity: null, { a!dropdownField( label: "Countries", placeholderLabel: "---Select a Country---", choiceLabels: fn!index(local!countries,"countryName", null), choiceValues: fn!index(local!countries,"countryId",null), value: local!selectedCountry, saveInto: { local!selectedCountry, a!save( {local!selectedState,local!selectedCity}, null ) } ), a!dropdownField( showWhen: fn!not(fn!isnull(local!selectedCountry)), label: concat( "States for ", local!countries.countryName[ wherecontains( local!selectedCountry,fn!tointeger(local!countries.countryId)) ] ), placeholderLabel: "---Select a State ---", choiceLabels: local!states.stateName[wherecontains(local!selectedCountry,tointeger(local!states.countryId))], choiceValues: local!states.stateId[wherecontains(local!selectedCountry,tointeger(local!states.countryId))], value: local!selectedState, saveInto: { local!selectedState, a!save( local!selectedCity, null ) } ), a!dropdownField( showWhen: fn!not(fn!isnull(local!selectedState)), label: concat( "Cities for ", local!states.stateName[ wherecontains( local!selectedState,fn!tointeger(local!states.stateId)) ] ), placeholderLabel: "---Select a City ---", choiceLabels: local!cities.cityName[wherecontains(local!selectedState, tointeger(local!cities.stateId))], choiceValues: local!cities.cityId[wherecontains(local!selectedState, tointeger(local!cities.stateId))], value: local!selectedCity, saveInto: { local!selectedCity } ) } )