Skip to content

Instantly share code, notes, and snippets.

@vinayakkulkarni
Created September 27, 2016 11:37
Show Gist options
  • Save vinayakkulkarni/f27d2b4992e717d24674e83fac78ec38 to your computer and use it in GitHub Desktop.
Save vinayakkulkarni/f27d2b4992e717d24674e83fac78ec38 to your computer and use it in GitHub Desktop.
Countries dropdown snippet in Semantic-UI format ( ISO-3366-1: Alpha-2 Codes )
<!-- Make sure you have Semantic-UI libs include
Also, Ensure you import jQuery for smooth transition
Once you have all the imports add this to your html:
<script type="text/javascript">
$(document).ready(function() {
$('.dropdown').dropdown();
$('.ui.checkbox').checkbox();
});
</script>
-->
<!-- Inspired from http://www.freeformatter.com/iso-country-list-html-select.html !-->
<div class="field">
<label>Country</label>
<div class="ui selection dropdown">
<input type="hidden" name="country">
<i class="dropdown icon"></i>
<div class="default text">Select</div>
<div class="menu">
<div class="item" value="AF">Afghanistan</div>
<div class="item" value="AX">Åland Islands</div>
<div class="item" value="AL">Albania</div>
<div class="item" value="DZ">Algeria</div>
<div class="item" value="AS">American Samoa</div>
<div class="item" value="AD">Andorra</div>
<div class="item" value="AO">Angola</div>
<div class="item" value="AI">Anguilla</div>
<div class="item" value="AQ">Antarctica</div>
<div class="item" value="AG">Antigua and Barbuda</div>
<div class="item" value="AR">Argentina</div>
<div class="item" value="AM">Armenia</div>
<div class="item" value="AW">Aruba</div>
<div class="item" value="AU">Australia</div>
<div class="item" value="AT">Austria</div>
<div class="item" value="AZ">Azerbaijan</div>
<div class="item" value="BS">Bahamas</div>
<div class="item" value="BH">Bahrain</div>
<div class="item" value="BD">Bangladesh</div>
<div class="item" value="BB">Barbados</div>
<div class="item" value="BY">Belarus</div>
<div class="item" value="BE">Belgium</div>
<div class="item" value="BZ">Belize</div>
<div class="item" value="BJ">Benin</div>
<div class="item" value="BM">Bermuda</div>
<div class="item" value="BT">Bhutan</div>
<div class="item" value="BO">Bolivia, Plurinational State of</div>
<div class="item" value="BQ">Bonaire, Sint Eustatius and Saba</div>
<div class="item" value="BA">Bosnia and Herzegovina</div>
<div class="item" value="BW">Botswana</div>
<div class="item" value="BV">Bouvet Island</div>
<div class="item" value="BR">Brazil</div>
<div class="item" value="IO">British Indian Ocean Territory</div>
<div class="item" value="BN">Brunei Darussalam</div>
<div class="item" value="BG">Bulgaria</div>
<div class="item" value="BF">Burkina Faso</div>
<div class="item" value="BI">Burundi</div>
<div class="item" value="KH">Cambodia</div>
<div class="item" value="CM">Cameroon</div>
<div class="item" value="CA">Canada</div>
<div class="item" value="CV">Cape Verde</div>
<div class="item" value="KY">Cayman Islands</div>
<div class="item" value="CF">Central African Republic</div>
<div class="item" value="TD">Chad</div>
<div class="item" value="CL">Chile</div>
<div class="item" value="CN">China</div>
<div class="item" value="CX">Christmas Island</div>
<div class="item" value="CC">Cocos (Keeling) Islands</div>
<div class="item" value="CO">Colombia</div>
<div class="item" value="KM">Comoros</div>
<div class="item" value="CG">Congo</div>
<div class="item" value="CD">Congo, the Democratic Republic of the</div>
<div class="item" value="CK">Cook Islands</div>
<div class="item" value="CR">Costa Rica</div>
<div class="item" value="CI">Côte d'Ivoire</div>
<div class="item" value="HR">Croatia</div>
<div class="item" value="CU">Cuba</div>
<div class="item" value="CW">Curaçao</div>
<div class="item" value="CY">Cyprus</div>
<div class="item" value="CZ">Czech Republic</div>
<div class="item" value="DK">Denmark</div>
<div class="item" value="DJ">Djibouti</div>
<div class="item" value="DM">Dominica</div>
<div class="item" value="DO">Dominican Republic</div>
<div class="item" value="EC">Ecuador</div>
<div class="item" value="EG">Egypt</div>
<div class="item" value="SV">El Salvador</div>
<div class="item" value="GQ">Equatorial Guinea</div>
<div class="item" value="ER">Eritrea</div>
<div class="item" value="EE">Estonia</div>
<div class="item" value="ET">Ethiopia</div>
<div class="item" value="FK">Falkland Islands (Malvinas)</div>
<div class="item" value="FO">Faroe Islands</div>
<div class="item" value="FJ">Fiji</div>
<div class="item" value="FI">Finland</div>
<div class="item" value="FR">France</div>
<div class="item" value="GF">French Guiana</div>
<div class="item" value="PF">French Polynesia</div>
<div class="item" value="TF">French Southern Territories</div>
<div class="item" value="GA">Gabon</div>
<div class="item" value="GM">Gambia</div>
<div class="item" value="GE">Georgia</div>
<div class="item" value="DE">Germany</div>
<div class="item" value="GH">Ghana</div>
<div class="item" value="GI">Gibraltar</div>
<div class="item" value="GR">Greece</div>
<div class="item" value="GL">Greenland</div>
<div class="item" value="GD">Grenada</div>
<div class="item" value="GP">Guadeloupe</div>
<div class="item" value="GU">Guam</div>
<div class="item" value="GT">Guatemala</div>
<div class="item" value="GG">Guernsey</div>
<div class="item" value="GN">Guinea</div>
<div class="item" value="GW">Guinea-Bissau</div>
<div class="item" value="GY">Guyana</div>
<div class="item" value="HT">Haiti</div>
<div class="item" value="HM">Heard Island and McDonald Islands</div>
<div class="item" value="VA">Holy See (Vatican City State)</div>
<div class="item" value="HN">Honduras</div>
<div class="item" value="HK">Hong Kong</div>
<div class="item" value="HU">Hungary</div>
<div class="item" value="IS">Iceland</div>
<div class="item" value="IN">India</div>
<div class="item" value="ID">Indonesia</div>
<div class="item" value="IR">Iran, Islamic Republic of</div>
<div class="item" value="IQ">Iraq</div>
<div class="item" value="IE">Ireland</div>
<div class="item" value="IM">Isle of Man</div>
<div class="item" value="IL">Israel</div>
<div class="item" value="IT">Italy</div>
<div class="item" value="JM">Jamaica</div>
<div class="item" value="JP">Japan</div>
<div class="item" value="JE">Jersey</div>
<div class="item" value="JO">Jordan</div>
<div class="item" value="KZ">Kazakhstan</div>
<div class="item" value="KE">Kenya</div>
<div class="item" value="KI">Kiribati</div>
<div class="item" value="KP">Korea, Democratic People's Republic of</div>
<div class="item" value="KR">Korea, Republic of</div>
<div class="item" value="KW">Kuwait</div>
<div class="item" value="KG">Kyrgyzstan</div>
<div class="item" value="LA">Lao People's Democratic Republic</div>
<div class="item" value="LV">Latvia</div>
<div class="item" value="LB">Lebanon</div>
<div class="item" value="LS">Lesotho</div>
<div class="item" value="LR">Liberia</div>
<div class="item" value="LY">Libya</div>
<div class="item" value="LI">Liechtenstein</div>
<div class="item" value="LT">Lithuania</div>
<div class="item" value="LU">Luxembourg</div>
<div class="item" value="MO">Macao</div>
<div class="item" value="MK">Macedonia, the former Yugoslav Republic of</div>
<div class="item" value="MG">Madagascar</div>
<div class="item" value="MW">Malawi</div>
<div class="item" value="MY">Malaysia</div>
<div class="item" value="MV">Maldives</div>
<div class="item" value="ML">Mali</div>
<div class="item" value="MT">Malta</div>
<div class="item" value="MH">Marshall Islands</div>
<div class="item" value="MQ">Martinique</div>
<div class="item" value="MR">Mauritania</div>
<div class="item" value="MU">Mauritius</div>
<div class="item" value="YT">Mayotte</div>
<div class="item" value="MX">Mexico</div>
<div class="item" value="FM">Micronesia, Federated States of</div>
<div class="item" value="MD">Moldova, Republic of</div>
<div class="item" value="MC">Monaco</div>
<div class="item" value="MN">Mongolia</div>
<div class="item" value="ME">Montenegro</div>
<div class="item" value="MS">Montserrat</div>
<div class="item" value="MA">Morocco</div>
<div class="item" value="MZ">Mozambique</div>
<div class="item" value="MM">Myanmar</div>
<div class="item" value="NA">Namibia</div>
<div class="item" value="NR">Nauru</div>
<div class="item" value="NP">Nepal</div>
<div class="item" value="NL">Netherlands</div>
<div class="item" value="NC">New Caledonia</div>
<div class="item" value="NZ">New Zealand</div>
<div class="item" value="NI">Nicaragua</div>
<div class="item" value="NE">Niger</div>
<div class="item" value="NG">Nigeria</div>
<div class="item" value="NU">Niue</div>
<div class="item" value="NF">Norfolk Island</div>
<div class="item" value="MP">Northern Mariana Islands</div>
<div class="item" value="NO">Norway</div>
<div class="item" value="OM">Oman</div>
<div class="item" value="PK">Pakistan</div>
<div class="item" value="PW">Palau</div>
<div class="item" value="PS">Palestinian Territory, Occupied</div>
<div class="item" value="PA">Panama</div>
<div class="item" value="PG">Papua New Guinea</div>
<div class="item" value="PY">Paraguay</div>
<div class="item" value="PE">Peru</div>
<div class="item" value="PH">Philippines</div>
<div class="item" value="PN">Pitcairn</div>
<div class="item" value="PL">Poland</div>
<div class="item" value="PT">Portugal</div>
<div class="item" value="PR">Puerto Rico</div>
<div class="item" value="QA">Qatar</div>
<div class="item" value="RE">Réunion</div>
<div class="item" value="RO">Romania</div>
<div class="item" value="RU">Russian Federation</div>
<div class="item" value="RW">Rwanda</div>
<div class="item" value="BL">Saint Barthélemy</div>
<div class="item" value="SH">Saint Helena, Ascension and Tristan da Cunha</div>
<div class="item" value="KN">Saint Kitts and Nevis</div>
<div class="item" value="LC">Saint Lucia</div>
<div class="item" value="MF">Saint Martin (French part)</div>
<div class="item" value="PM">Saint Pierre and Miquelon</div>
<div class="item" value="VC">Saint Vincent and the Grenadines</div>
<div class="item" value="WS">Samoa</div>
<div class="item" value="SM">San Marino</div>
<div class="item" value="ST">Sao Tome and Principe</div>
<div class="item" value="SA">Saudi Arabia</div>
<div class="item" value="SN">Senegal</div>
<div class="item" value="RS">Serbia</div>
<div class="item" value="SC">Seychelles</div>
<div class="item" value="SL">Sierra Leone</div>
<div class="item" value="SG">Singapore</div>
<div class="item" value="SX">Sint Maarten (Dutch part)</div>
<div class="item" value="SK">Slovakia</div>
<div class="item" value="SI">Slovenia</div>
<div class="item" value="SB">Solomon Islands</div>
<div class="item" value="SO">Somalia</div>
<div class="item" value="ZA">South Africa</div>
<div class="item" value="GS">South Georgia and the South Sandwich Islands</div>
<div class="item" value="SS">South Sudan</div>
<div class="item" value="ES">Spain</div>
<div class="item" value="LK">Sri Lanka</div>
<div class="item" value="SD">Sudan</div>
<div class="item" value="SR">Suriname</div>
<div class="item" value="SJ">Svalbard and Jan Mayen</div>
<div class="item" value="SZ">Swaziland</div>
<div class="item" value="SE">Sweden</div>
<div class="item" value="CH">Switzerland</div>
<div class="item" value="SY">Syrian Arab Republic</div>
<div class="item" value="TW">Taiwan, Province of China</div>
<div class="item" value="TJ">Tajikistan</div>
<div class="item" value="TZ">Tanzania, United Republic of</div>
<div class="item" value="TH">Thailand</div>
<div class="item" value="TL">Timor-Leste</div>
<div class="item" value="TG">Togo</div>
<div class="item" value="TK">Tokelau</div>
<div class="item" value="TO">Tonga</div>
<div class="item" value="TT">Trinidad and Tobago</div>
<div class="item" value="TN">Tunisia</div>
<div class="item" value="TR">Turkey</div>
<div class="item" value="TM">Turkmenistan</div>
<div class="item" value="TC">Turks and Caicos Islands</div>
<div class="item" value="TV">Tuvalu</div>
<div class="item" value="UG">Uganda</div>
<div class="item" value="UA">Ukraine</div>
<div class="item" value="AE">United Arab Emirates</div>
<div class="item" value="GB">United Kingdom</div>
<div class="item" value="US">United States</div>
<div class="item" value="UM">United States Minor Outlying Islands</div>
<div class="item" value="UY">Uruguay</div>
<div class="item" value="UZ">Uzbekistan</div>
<div class="item" value="VU">Vanuatu</div>
<div class="item" value="VE">Venezuela, Bolivarian Republic of</div>
<div class="item" value="VN">Viet Nam</div>
<div class="item" value="VG">Virgin Islands, British</div>
<div class="item" value="VI">Virgin Islands, U.S.</div>
<div class="item" value="WF">Wallis and Futuna</div>
<div class="item" value="EH">Western Sahara</div>
<div class="item" value="YE">Yemen</div>
<div class="item" value="ZM">Zambia</div>
<div class="item" value="ZW">Zimbabwe</div>
</div>
</div>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment