It occurred to me this morning that I’m alienating many potential customers by only targeting Northern California. That’s eliminating many potential customers. Is there a way in developer tools to create a script for drop down menu for viewers to choose their State and then city without creating multiple pages for each choice?
I accidentally deleted our previous correspondence. I hope you receive this!
John
Hi,
You can review the example here . Note that you can open the editor and copy the code.
Best,
Tal.
Hey Tal,
Thanks for your responding!
Is there a way to customize this? I would like to delete the world countries and just have the US States displayed in the first drop down and then US Cities in the second drop down? Let me know when you get a chance. I’m an amateur when it comes to Java code -
Best,
John
Hi John,
please have a look at the link Tal sent, there is an actual working example there. you can use it as a reference and change it according to your use case. specifically have a look at the below data.
i am sure you can find the data in the web out there 
and by the way, it is not java, it Javascript which is whole other language
good luck!
Shlomi
export const usStates = [
{value:“”, label: “Select a state”},
{value:“AL”, label: “Alabama”},
{value:“AK”, label: “Alaska”},
{value:“AZ”, label: “Arizona”},
{value:“AR”, label: “Arkansas”},
{value:“CA”, label: “California”},
{value:“CO”, label: “Colorado”},
{value:“CT”, label: “Connecticut”},
{value:“DE”, label: “Delaware”},
{value:“FL”, label: “Florida”},
{value:“GA”, label: “Georgia”},
{value:“HI”, label: “Hawaii”},
{value:“ID”, label: “Idaho”},
{value:“IL”, label: “Illinois”},
{value:“IN”, label: “Indiana”},
{value:“IA”, label: “Iowa”},
{value:“KS”, label: “Kansas”},
{value:“KY”, label: “Kentucky”},
{value:“LA”, label: “Louisiana”},
{value:“ME”, label: “Maine”},
{value:“MD”, label: “Maryland”},
{value:“MA”, label: “Massachusetts”},
{value:“MI”, label: “Michigan”},
{value:“MN”, label: “Minnesota”},
{value:“MS”, label: “Mississippi”},
{value:“MO”, label: “Missouri”},
{value:“MT”, label: “Montana”},
{value:“NE”, label: “Nebraska”},
{value:“NV”, label: “Nevada”},
{value:“NH”, label: “New Hampshire”},
{value:“NJ”, label: “New Jersey”},
{value:“NM”, label: “New Mexico”},
{value:“NY”, label: “New York”},
{value:“NC”, label: “North Carolina”},
{value:“ND”, label: “North Dakota”},
{value:“OH”, label: “Ohio”},
{value:“OK”, label: “Oklahoma”},
{value:“OR”, label: “Oregon”},
{value:“PA”, label: “Pennsylvania”},
{value:“RI”, label: “Rhode Island”},
{value:“SC”, label: “South Carolina”},
{value:“SD”, label: “South Dakota”},
{value:“TN”, label: “Tennessee”},
{value:“TX”, label: “Texas”},
{value:“UT”, label: “Utah”},
{value:“VT”, label: “Vermont”},
{value:“VA”, label: “Virginia”},
{value:“WA”, label: “Washington”},
{value:“WV”, label: “West Virginia”},
{value:“WI”, label: “Wisconsin”},
{value:“WY”, label: “Wyoming”},
];
export const canadaStates = [
{label: “Alberta”, value: “AB”},
{label: “British Columbia”, value: “BC”},
{label: “Manitoba”, value: “MB”},
{label: “New Brunswick”, value: “NB”},
{label: “Newfoundland and Labrador”, value: “NL”},
{label: “Nova Scotia”, value: “NS”},
{label: “Northwest Territories”, value: “NT”},
{label: “Nunavut”, value: “NU”},
{label: “Ontario”, value: “ON”},
{label: “Prince Edward Island”, value: “PE”},
{label: “Quebec”, value: “QC”},
{label: “Saskatchewan”, value: “SK”},
{label: “Yukon”, value: “YT”},
];
Hey Shlomi,
Yea, I checked out the working example Tal sent. That’s exactly what I’m looking for, but I don’t want the world countries in the first drop down. Looking to have the US states in the first cascade and then the US cities in the second drop down.
Thanks for the heads up on Java vs JavaScript! I’ll see if I can find the US city JavaScript on the web and play around with it. Getting better everyday!
John
Wow - Great resource Shlomi - Thanks!
Now I have to figure out how to make a reoccurring dynamic page that will allow me to imitate the below two pages. The site is getting there -
Hey Shlomi - Hope all is well!
I’m having problems entering the scripting correctly. Keep getting error messages. Where exactly do I enter the state and cities scripts? Please see screen-shot below
STATE EXAMPLES
export const usStates = [
{value:“”, label: “Select a state”},
{value:“AL”, label: “Alabama”},
{value:“AK”, label: “Alaska”},
{value:“AZ”, label: “Arizona”},
{value:“AR”, label: “Arkansas”},
CITIES EXAMPLES
California": [“ACTON”, “ADELANTO”, “AGOURA HILLS”, “ALAMEDA”, “ALAMO”, “ALBANY”, “ALHAMBRA”, “ALISO VIEJO”, “ALMANOR”, “ALONDRA PARK”, “ALPAUGH”, “ALPINE”, “ALPINE VILLAGE”, “ALTADENA”, “ALTA SIERRA”, “ALTURAS”, “ALUM ROCK”, “AMADOR CITY”, “AMERICAN CANYON”, “AMESTI”, “ANAHEIM”, “ANDERSON”,
California": [“ACTON”, “ADELANTO”, “AGOURA HILLS”, “ALAMEDA”, “ALAMO”, “ALBANY”, “ALHAMBRA”, “ALISO VIEJO”, “ALMANOR”, “ALONDRA PARK”, “ALPAUGH”, “ALPINE”, “ALPINE VILLAGE”, “ALTADENA”, “ALTA SIERRA”, “ALTURAS”, “ALUM ROCK”, “AMADOR CITY”, “AMERICAN CANYON”, “AMESTI”, “ANAHEIM”, “ANDERSON”,
Hi John,
unfortunately i will not be able to help you with the actual implementation
wish you the best of luck!
Shlomi
Okay, Thanks for replying Shlomi!
I understand - I will keep after it and when I figure it all out I will shoot you a message when my site is live. Thanks for all your past help!
John
Thanks again, and the best of luck!
I learnt it. I realize it’s wrong!
In wix is just supported by this code to create a list of options:
$w(“#myDropdown”).options = [ {“label”: “Who’s on first!”, “value”: “first”}, {“label”: “What’s on second”, “value”: “second”}, {“label”: “I Don’t Know is on third”, “value”: “third”} ];
BUT:
the code in cascading form said:
$w(“#myDropdown”).options = field
This is not supported! Then, It annouced that " your dropdown cannot set to be null or unndefined." Becuz it was not the form wix supported
