Drop-down list of United States, Canada, and Mexico states or provinces Jul04 '06
Since I’m always searching for this, when the need arises - I’d thought I’d post it here, so I can always find it easily.
This is for web developers, who quickly need to add a "drop down" list of all the U.S. states, Mexican states, and the provinces in Canada, for a web form.
All you have to do is copy/paste this code into your site.
It’s viewable as the full name of the state/province, but the value is just the two-letter abbreviation. It also includes an id attribute for each, with the attribute value being the two-letter abbreviation. This is for when you need to use JavaScript to pre-select a particular option value.
Here’s what the drop-down looks like:
And here’s the actual HTML:
<select>
<option></option>
<optgroup label="United States">
<option id="USA-AL" value="AL">Alabama (AL)</option>
<option id="USA-AK" value="AK">Alaska (AK)</option>
<option id="USA-AZ" value="AZ">Arizona (AZ)</option>
<option id="USA-AR" value="AR">Arkansas (AR)</option>
<option id="USA-CA" value="CA">California (CA)</option>
<option id="USA-CO" value="CO">Colorado (CO)</option>
<option id="USA-CT" value="CT">Connecticut (CT)</option>
<option id="USA-DE" value="DE">Delaware (DE)</option>
<option id="USA-DC" value="DC">District of Columbia (DC)</option>
<option id="USA-FL" value="FL">Florida (FL)</option>
<option id="USA-GA" value="GA">Georgia (GA)</option>
<option id="USA-GU" value="GU">Guam (GU)</option>
<option id="USA-HI" value="HI">Hawaii (HI)</option>
<option id="USA-ID" value="ID">Idaho (ID)</option>
<option id="USA-IL" value="IL">Illinois (IL)</option>
<option id="USA-IN" value="IN">Indiana (IN)</option>
<option id="USA-IA" value="IA">Iowa (IA)</option>
<option id="USA-KS" value="KS">Kansas (KS)</option>
<option id="USA-KY" value="KY">Kentucky (KY)</option>
<option id="USA-LA" value="LA">Louisiana (LA)</option>
<option id="USA-ME" value="ME">Maine (ME)</option>
<option id="USA-MD" value="MD">Maryland (MD)</option>
<option id="USA-MA" value="MA">Massachusetts (MA)</option>
<option id="USA-MI" value="MI">Michigan (MI)</option>
<option id="USA-MN" value="MN">Minnesota (MN)</option>
<option id="USA-MS" value="MS">Mississippi (MS)</option>
<option id="USA-MO" value="MO">Missouri (MO)</option>
<option id="USA-MT" value="MT">Montana (MT)</option>
<option id="USA-NE" value="NE">Nebraska (NE)</option>
<option id="USA-NV" value="NV">Nevada (NV)</option>
<option id="USA-NH" value="NH">New Hampshire (NH)</option>
<option id="USA-NJ" value="NJ">New Jersey (NJ)</option>
<option id="USA-NM" value="NM">New Mexico (NM)</option>
<option id="USA-NY" value="NY">New York (NY)</option>
<option id="USA-NC" value="NC">North Carolina (NC)</option>
<option id="USA-ND" value="ND">North Dakota (ND)</option>
<option id="USA-OH" value="OH">Ohio (OH)</option>
<option id="USA-OK" value="OK">Oklahoma (OK)</option>
<option id="USA-OR" value="OR">Oregon (OR)</option>
<option id="USA-PA" value="PA">Pennyslvania (PA)</option>
<option id="USA-PR" value="PR">Puerto Rico (PR)</option>
<option id="USA-RI" value="RI">Rhode Island (RI)</option>
<option id="USA-SC" value="SC">South Carolina (SC)</option>
<option id="USA-SD" value="SD">South Dakota (SD)</option>
<option id="USA-TN" value="TN">Tennessee (TN)</option>
<option id="USA-TX" value="TX">Texas (TX)</option>
<option id="USA-UT" value="UT">Utah (UT)</option>
<option id="USA-VT" value="VT">Vermont (VT)</option>
<option id="USA-VA" value="VA">Virginia (VA)</option>
<option id="USA-VI" value="VI">Virgin Islands (VI)</option>
<option id="USA-WA" value="WA">Washington (WA)</option>
<option id="USA-WV" value="WV">West Virginia (WV)</option>
<option id="USA-WI" value="WI">Wisconsin (WI)</option>
<option id="USA-WY" value="WY">Wyoming (WY)</option>
</optgroup>
<optgroup label="Canada">
<option id="CAN-AB" value="AB">Alberta (AB)</option>
<option id="CAN-BC" value="BC">British Columbia (BC)</option>
<option id="CAN-MB" value="MB">Manitoba (MB)</option>
<option id="CAN-NB" value="NB">New Brunswick (NB)</option>
<option id="CAN-NL" value="NL">Newfoundland and Labrador (NL)</option>
<option id="CAN-NT" value="NT">Northwest Territories (NT)</option>
<option id="CAN-NS" value="NS">Nova Scotia (NS)</option>
<option id="CAN-NU" value="NU">Nunavut (NU)</option>
<option id="CAN-PE" value="PE">Prince Edward Island (PE)</option>
<option id="CAN-SK" value="SK">Saskatchewan (SK)</option>
<option id="CAN-ON" value="ON">Ontario (ON)</option>
<option id="CAN-QC" value="QC">Quebec (QC)</option>
<option id="CAN-YT" value="YT">Yukon (YT)</option>
</optgroup>
<optgroup label="Mexico">
<option id="MEX-AGS" value="AGS">Aguascalientes (AGS)</option>
<option id="MEX-BCN" value="BCN">Baja California Norte (BCN)</option>
<option id="MEX-BCS" value="BCS">Baja California Sur (BCS)</option>
<option id="MEX-CAM" value="CAM">Campeche (CAM)</option>
<option id="MEX-CHIS" value="CHIS">Chiapas (CHIS)</option>
<option id="MEX-CHIH" value="CHIH">Chihuahua (CHIH)</option>
<option id="MEX-COAH" value="COAH">Coahuila (COAH)</option>
<option id="MEX-COL" value="COL">Colima (COL)</option>
<option id="MEX-DF" value="DF">Distrito Federal (DF)</option>
<option id="MEX-DGO" value="DGO">Durango (DGO)</option>
<option id="MEX-GTO" value="GTO">Guanajuato (GTO)</option>
<option id="MEX-GRO" value="GRO">Guerrero (GRO)</option>
<option id="MEX-HGO" value="HGO">Hidalgo (HGO)</option>
<option id="MEX-JAL" value="JAL">Jalisco (JAL)</option>
<option id="MEX-EDM" value="EDM">México - Estado de (EDM)</option>
<option id="MEX-MICH" value="MICH">Michoacán (MICH)</option>
<option id="MEX-MOR" value="MOR">Morelos (MOR)</option>
<option id="MEX-NAY" value="NAY">Nayarit (NAY)</option>
<option id="MEX-NL" value="NL">Nuevo León (NL)</option>
<option id="MEX-OAX" value="OAX">Oaxaca (OAX)</option>
<option id="MEX-PUE" value="PUE">Puebla (PUE)</option>
<option id="MEX-QRO" value="QRO">Querétaro (QRO)</option>
<option id="MEX-QROO" value="QROO">Quintana Roo (QROO)</option>
<option id="MEX-SLP" value="SLP">San Luis Potosí (SLP)</option>
<option id="MEX-SIN" value="SIN">Sinaloa (SIN)</option>
<option id="MEX-SON" value="SON">Sonora (SON)</option>
<option id="MEX-TAB" value="TAB">Tabasco (TAB)</option>
<option id="MEX-TAMPS" value="TAMPS">Tamaulipas (TAMPS)</option>
<option id="MEX-TLAX" value="TLAX">Tlaxcala (TLAX)</option>
<option id="MEX-VER" value="VER">Veracruz (VER)</option>
<option id="MEX-YUC" value="YUC">Yucatán (YUC)</option>
<option id="MEX-ZAC" value="ZAC">Zacatecas (ZAC)</option>
</optgroup>
</select>
Categories: Code 
Add Feedback (view all)
Leave feedback
great stuff and very handy! it might also be useful to separate the u.s. states and canadian provinces using the element. ... Read more.
i see this strips element tags - the above should read optgroup element ... Read more.
Yes, optgroup is a good idea. Thanks... ... Read more.
This is a lifesaver. Thanks!! ... Read more.
Shouldn't DC be grouped with the US states? ... Read more.
OK I've made the following changes, based on feedback: Added Yukon territory. Added <optgroup> elements t ... Read more.
I am using a similar list, although not as nicely laid out with Optgroup. I recently had an enquiry about adding state/province values for other co ... Read more.
Nathaniel, I haven't had that request yet. I'm not sure how other countries/regions handle postal codes. I'd be curious to know though. ... Read more.
UPDATE: Mexico states are now included in the list. I also modified the id attribute to be preceded with the three letter country code ... Read more.
You saved me lots of time. Thank you soo much ... Read more.
You just saved me a lot of typing. Thanks! ... Read more.
Nice thanks a lot for the list!!! ... Read more.
This help me very much. Thank you very much ... Read more.
This is what the Internet is (supposed to be) about. I looked for it, I found it! Thank you for sharing. ... Read more.
thanks ... Read more.
I'm new web developing and this was a huge time saver, I appreciate you thinking about others. ... Read more.
Thank you so much for this! Your a time/life-saver!!!! ... Read more.
thanks dude. ... Read more.
great + cheers from berlin! ... Read more.
- Switching to Google Notebook from Ta-Da lists
- Pirates 2 this weekend
- Customize Brightkite-to-Twitter updates
Popular Pages
- Fast rounded corners in Photoshop (7424 recent visits)
- PHP – passing variables across pages (2558 recent visits)
- JavaScript set selected on load (2414 recent visits)
- Removing all child nodes from an element (1828 recent visits)
- Firefox 3 smart address bar: wildcard search (1755 recent visits)
- iPod songs out of order? (1314 recent visits)
- Britney - Everytime piano tab (1138 recent visits)
- MySQL LEFT JOIN syntax (884 recent visits)
- Firefox 3 smart address bar: wildcard search (722 recent visits)
- Date difference in MySQL (651 recent visits)
Similar Entries
- AJAX select list issue in IE6 (144 recent visits)
- DHTML select list trouble, continued (149 recent visits)
- To-Do list and task manager web sites (63 recent visits)
- Removing static blogroll list (6 recent visits)
- Christmas list mediator (4 recent visits)
- Ordered list scenarios (43 recent visits)
Stats
530 unique visits since July 2008
Recent Referrers (click)
- canadian provinces drop down
- state drop down list
- canada state list
- states drop down list
- u.s. states for drop down list
- dropdowns states and provinces
- List of states and provinces for drop down list
- List of states and provinces for drop down list
- drop down list of provinces
- canada state list
- list out states in a drop down based on country
- List of Canadian States
- drop down list of states
- drop down state listing
- POSTAL CODES EDM, AB
- drop down menu of all canadian state
- +states +"drop down menu"
- Dropdown canadian states
- list of mexican provinces
- zoomerang list of states for dropdown
Forgot a province. Yukon ... Read more.