Get option value in form, then use it in a url

Get option value in form, then use it in a url - javascript

I have a form where you can select a nation, the nation contains a value. For example 34 with that value,<br> I can get a image if you put it in a url like 'http://packarmy.nl/img/nation/' . $_GET['nationvalue'] . '.png'
<img src='http://futhead.cursecdn.com/static/img/16/clubs/<? echo $_GET[nation_id] ?>' >
<select id="nation-id">
<option value="149">Afghanistan</option>
<option value="1">Albania</option>
<option value="97">Algeria</option>
<option value="194">American Samoa</option>
<option value="2">Andorra</option>
<option value="98">Angola</option>
<option value="62">Anguilla</option>
<option value="63">Antigua & Barbuda</option>
<option value="52" selected="yes">Argentina</option>
<option value="3">Armenia</option>
<option value="64">Aruba</option>
<option value="195">Australia</option>
<option value="4">Austria</option>
<option value="5">Azerbaijan</option>
<option value="65">Bahamas</option>
<option value="150">Bahrain</option>
<option value="151">Bangladesh</option>
<option value="66">Barbados</option>
<option value="6">Belarus</option>
<option value="7">Belgium</option>
<option value="67">Belize</option>
<option value="99">Benin</option>
<option value="68">Bermuda</option>
<option value="152">Bhutan</option>
<option value="53">Bolivia</option>
<option value="8">Bosnia Herzegovina</option>
<option value="100">Botswana</option>
<option value="54">Brazil</option>
<option value="69">British Virgin Isles</option>
<option value="153">Brunei Darussalam</option>
<option value="9">Bulgaria</option>
<option value="101">Burkina Faso</option>
<option value="102">Burundi</option>
<option value="154">Cambodia</option>
<option value="103">Cameroon</option>
<option value="70">Canada</option>
<option value="104">Cape Verde Islands</option>
<option value="71">Cayman Islands</option>
<option value="105">Central African Rep.</option>
<option value="106">Chad</option>
<option value="55">Chile</option>
<option value="155">China PR</option>
<option value="56">Colombia</option>
<option value="214">Comoros</option>
<option value="107">Congo</option>
<option value="196">Cook Islands</option>
<option value="72">Costa Rica</option>
<option value="10">Croatia</option>
<option value="73">Cuba</option>
<option value="11">Cyprus</option>
<option value="12">Czech Republic</option>
<option value="13">Denmark</option>
<option value="109">Djibouti</option>
<option value="74">Dominica</option>
<option value="207">Dominican Republic</option>
<option value="110">DR Congo</option>
<option value="57">Ecuador</option>
<option value="111">Egypt</option>
<option value="76">El Salvador</option>
<option value="14">England</option>
<option value="112">Equatorial Guinea</option>
<option value="113">Eritrea</option>
<option value="208">Estonia</option>
<option value="114">Ethiopia</option>
<option value="16">Faroe Islands</option>
<option value="197">Fiji</option>
<option value="17">Finland</option>
<option value="18">France</option>
<option value="19">FYR Macedonia</option>
<option value="115">Gabon</option>
<option value="116">Gambia</option>
<option value="20">Georgia</option>
<option value="21">Germany</option>
<option value="117">Ghana</option>
<option value="205">Gibraltar</option>
<option value="22">Greece</option>
<option value="206">Greenland</option>
<option value="77">Grenada</option>
<option value="157">Guam</option>
<option value="78">Guatemala</option>
<option value="118">Guinea</option>
<option value="119">Guinea Bissau</option>
<option value="79">Guyana</option>
<option value="80">Haiti</option>
<option value="81">Honduras</option>
<option value="158">Hong Kong</option>
<option value="23">Hungary</option>
<option value="24">Iceland</option>
<option value="159">India</option>
<option value="160">Indonesia</option>
<option value="161">Iran</option>
<option value="162">Iraq</option>
<option value="26">Israel</option>
<option value="27">Italy</option>
<option value="108">Ivory Coast</option>
<option value="82">Jamaica</option>
<option value="163">Japan</option>
<option value="164">Jordan</option>
<option value="165">Kazakhstan</option>
<option value="120">Kenya</option>
<option value="166">Korea DPR</option>
<option value="167">Korea Republic</option>
<option value="168">Kuwait</option>
<option value="169">Kyrgyzstan</option>
<option value="170">Laos</option>
<option value="28">Latvia</option>
<option value="171">Lebanon</option>
<option value="121">Lesotho</option>
<option value="122">Liberia</option>
<option value="123">Libya</option>
<option value="29">Liechtenstein</option>
<option value="30">Lithuania</option>
<option value="31">Luxemburg</option>
<option value="172">Macao</option>
<option value="124">Madagascar</option>
<option value="125">Malawi</option>
<option value="173">Malaysia</option>
<option value="174">Maldives</option>
<option value="126">Mali</option>
<option value="32">Malta</option>
<option value="127">Mauritania</option>
<option value="128">Mauritius</option>
<option value="83">Mexico</option>
<option value="33">Moldova</option>
<option value="175">Mongolia</option>
<option value="15">Montenegro</option>
<option value="84">Montserrat</option>
<option value="129">Morocco</option>
<option value="130">Mozambique</option>
<option value="176">Myanmar</option>
<option value="131">Namibia</option>
<option value="177">Nepal</option>
<option value="34">Netherlands</option>
<option value="85">Netherlands Antilles</option>
<option value="215">New Caledonia</option>
<option value="198">New Zealand</option>
<option value="86">Nicaragua</option>
<option value="132">Niger</option>
<option value="133">Nigeria</option>
<option value="35">Northern Ireland</option>
<option value="36">Norway</option>
<option value="178">Oman</option>
<option value="179">Pakistan</option>
<option value="180">Palestinian Authority</option>
<option value="87">Panama</option>
<option value="199">Papua New Guinea</option>
<option value="58">Paraguay</option>
<option value="59">Peru</option>
<option value="181">Philippines</option>
<option value="37">Poland</option>
<option value="38">Portugal</option>
<option value="88">Puerto Rico</option>
<option value="182">Qatar</option>
<option value="25">Republic of Ireland</option>
<option value="39">Romania</option>
<option value="40">Russia</option>
<option value="134">Rwanda</option>
<option value="200">Samoa</option>
<option value="41">San Marino</option>
<option value="135">São Tomé and Príncipe</option>
<option value="183">Saudi Arabia</option>
<option value="42">Scotland</option>
<option value="136">Senegal</option>
<option value="51">Serbia</option>
<option value="137">Seychelles</option>
<option value="138">Sierra Leone</option>
<option value="184">Singapore</option>
<option value="43">Slovakia</option>
<option value="44">Slovenia</option>
<option value="201">Solomon Islands</option>
<option value="139">Somalia</option>
<option value="140">South Africa</option>
<option value="45">Spain</option>
<option value="185">Sri Lanka</option>
<option value="89">St Kitts Nevis</option>
<option value="90">St Lucia</option>
<option value="91">St Vincent Grenadine</option>
<option value="141">Sudan</option>
<option value="92">Suriname</option>
<option value="142">Swaziland</option>
<option value="46">Sweden</option>
<option value="47">Switzerland</option>
<option value="186">Syria</option>
<option value="202">Tahiti</option>
<option value="213">Taiwan</option>
<option value="187">Tajikistan</option>
<option value="143">Tanzania</option>
<option value="188">Thailand</option>
<option value="212">Timor-Leste</option>
<option value="144">Togo</option>
<option value="203">Tonga</option>
<option value="93">Trinidad & Tobago</option>
<option value="145">Tunisia</option>
<option value="48">Turkey</option>
<option value="189">Turkmenistan</option>
<option value="94">Turks & Caicos</option>
<option value="146">Uganda</option>
<option value="49">Ukraine</option>
<option value="190">United Arab Emirates</option>
<option value="95">United States</option>
<option value="60">Uruguay</option>
<option value="96">US Virgin Islands</option>
<option value="191">Uzbekistan</option>
<option value="204">Vanuatu</option>
<option value="61">Venezuela</option>
<option value="192">Vietnam</option>
<option value="50">Wales</option>
<option value="193">Yemen</option>
<option value="147">Zambia</option>
<option value="148">Zimbabwe</option>
</select>
But I want it to update immediately which I tryed with this code:
$(function() {
var update = function() {
$('#photoans').text(
$.map($('#photo').serializeArray(),function(a) {
return a.value;
}).join(", ")
);
};
update();
$('#photo').change(update);
})
Which ofcourse gets you http://futhead.cursecdn.com/static/img/16/clubs/"<div id=photoans>34</div>".png' so that doesn't work. I hope someone can help me. Thanks!

If i understood correctly, I guess this is what you want:
$("#country").change(function(){
var curSelection = $(this).val();
var urlOfImage = "http://ariellarestaurant.com/Scripts/Widgets/Timer/odometer/" + curSelection + ".png";
$("img").attr("src",urlOfImage);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<img src="http://ariellarestaurant.com/Scripts/Widgets/Timer/odometer/0.png" />
<br>
<select id="country">
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
Update : Using Input Field
$("#countryInput").keyup(function(){
var curInput = $(this).val(); // Current Input URL
$("#img2").attr("src",curInput);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<img id="img2" src="http://ariellarestaurant.com/Scripts/Widgets/Timer/odometer/0.png" />
<br>
URL : <input type="text" id="countryInput" />
<p>
To understand copy and paste this url: <b>http://ariellarestaurant.com/Scripts/Widgets/Timer/odometer/1.png</b>
</p>

You need start php and end php tag for echo $_GET content value nation_id
<img src='http://futhead.cursecdn.com/static/img/16/clubs/"<?php echo $_GET['nation_id'] ?>"' >
if you setup php interpritator

Related

Why are the 2 <select> elements that are being appended to my form not looking the same as the first 2 fixed in my Form?

I have an HTML form that gets company information.
In that form, I have 2 <select multiple> elements (one for company countries and one for sectors) on which I used JQuery and Bootstrap to give them a nice style and to allow the user to choose multiple options in an easier manner.
The Problem: When the user clicks "Add Company Button" to add a new company section to the form, the appended <select multiple> elements are not being styled the same way.
The difference isn't between the first two select fields, it is rather between the first 2 select fields and the pairs that get added when you click 'Add Company'. The first two are appearing how I want them (2 rectangular boxes in which the user clicks on multiple options from the dropdown), while the others are appearing like an unstyled dropdown where you have to press Ctrl+click on the options you want to select
Please note that I removed the CSS and other parts of the page to keep things simple. Also in the appended section, I removed some options to stay within the character limit of this post
The code:
$(document).ready(function() {
$(".mul-select").select2({
placeholder: "Select Company Sectors", //placeholder
tags: true,
tokenSeparators: ['/', ',', ';', " "]
});
})
$(document).ready(function() {
$(".mul-select.countries").select2({
placeholder: "Company's Country Locations", //placeholder
tags: true,
tokenSeparators: ['/', ',', ';', " "]
});
})
$(document).ready(function() {
$("body").on("click", ".add_new_frm_field_btn", function() {
var index = $(".company-info").find(".company-info-row").length + 1;
$(".company-info").append(`
<div class="added company-info-row" style="margin:5% 0 0 0;">
<div class="company-data" style="padding:1% 4%;">
<div>
<select name="addedCompany[${index}][sectors][]" id="accountSector_${index}" class="dropdown mul-select" multiple="" tabindex="-1" aria-hidden="true">
<option value="Advertising">Advertising</option>
<option value="Aerospace">Aerospace</option>
<option value="Agriculture">Agriculture</option>
</select>
</div>
<div>
<select name="addedCompany[${index}][countries][]" id="additionalAccountLocations_${index}" class="dropdown mul-select countries" multiple="true">
<option value="Afganistan">Afghanistan</option>
<option value="Albania">Albania</option>
<option value="Algeria">Algeria</option>
</select>
</div>
</div>
<div class="add_del_btn_outer_comp" style="margin:0 4% 0 4%;">
<button class="add_new_frm_field_btn">
<img src="add-icon.png" alt="Add Company Button">
</button>
<button class="remove_node_btn_frm_field" disabled>
<img src="remove-icon.png" alt="Remove Company Button">
</button>
</div>
</div>
</div>
`);
$(".company-info").find(".remove_node_btn_frm_field:not(:first)").prop("disabled", false);
$(".company-info").find(".remove_node_btn_frm_field").first().prop("disabled", true);
});
});
$(document).ready(function() {
//===== delete the form feed row
$("body").on("click", ".remove_node_btn_frm_field", function() {
$(this).closest(".company-info-row").remove();
console.log("success");
});
});
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/css/select2.min.css">
<!--<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/js/select2.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
</head>
<body>
<div class="login-box">
<div class="company-info">
<div class="company-info-row">
<div class="company-data" style="padding:1% 4%;">
<div>
<select name="company[sectors][]" id="accountSector" class="dropdown mul-select" multiple>
<option value="Advertising">Advertising</option>
<option value="Aerospace">Aerospace</option>
<option value="Agriculture">Agriculture</option>
<option value="Apparel & Accessories">Apparel & Accessories</option>
<option value="Architecture">Architecture</option>
<option value="Automotive">Automotive</option>
<option value="Banking">Banking</option>
<option value="Biotechnology">Biotechnology</option>
<option value="Building Materials & Equipment">Building Materials & Equipment</option>
<option value="Chemical">Chemical</option>
<option value="Computer">Computer</option>
<option value="Construction">Construction</option>
<option value="Consulting">Consulting</option>
<option value="Creative">Creative</option>
<option value="Culture">Culture</option>
<option value="Defense">Defense</option>
<option value="Education">Education</option>
<option value="Electric Power">Electric Power</option>
<option value="Electronics">Electronics</option>
<option value="Energy">Energy</option>
<option value="Entertainment & Leisure">Entertainment & Leisure</option>
<option value="Finance">Finance</option>
<option value="Food & Beverage">Food & Beverage</option>
<option value="Grocery">Grocery</option>
<option value="Healthcare">Healthcare</option>
<option value="Hospitality">Hospitality</option>
<option value="Insurance">Insurance</option>
<option value="Legal">Legal</option>
<option value="Manufacturing">Manufacturing</option>
<option value="Marketing">Marketing</option>
<option value="Mass Media">Mass Media</option>
<option value="Mining">Mining</option>
<option value="Music">Music</option>
<option value="Petroleum">Petroleum</option>
<option value="Publishing">Publishing</option>
<option value="Real Estate">Real Estate</option>
<option value="Retail">Retail</option>
<option value="Service">Service</option>
<option value="Shipping">Shipping</option>
<option value="Software">Software</option>
<option value="Sports">Sports</option>
<option value="Support">Support</option>
<option value="Technology">Technology</option>
<option value="Telecommunications">Telecommunications</option>
<option value="Television">Television</option>
<option value="Testing, Inspection & Certification">Testing, Inspection & Certification</option>
<option value="Transportation">Transportation</option>
<option value="Travel">Travel</option>
<option value="Venture Capital">Venture Capital</option>
<option value="Water">Water</option>
<option value="Wholesale">Wholesale</option>
</select>
</div>
<div>
<select name="company[countries][]" id="additionalAccountLocations" class="dropdown mul-select countries" multiple>
<option value="Afganistan">Afghanistan</option>
<option value="Albania">Albania</option>
<option value="Algeria">Algeria</option>
<option value="American Samoa">American Samoa</option>
<option value="Andorra">Andorra</option>
<option value="Angola">Angola</option>
<option value="Anguilla">Anguilla</option>
<option value="Antigua & Barbuda">Antigua & Barbuda</option>
<option value="Argentina">Argentina</option>
<option value="Armenia">Armenia</option>
<option value="Aruba">Aruba</option>
<option value="Australia">Australia</option>
<option value="Austria">Austria</option>
<option value="Azerbaijan">Azerbaijan</option>
<option value="Bahamas">Bahamas</option>
<option value="Bahrain">Bahrain</option>
<option value="Bangladesh">Bangladesh</option>
<option value="Barbados">Barbados</option>
<option value="Belarus">Belarus</option>
<option value="Belgium">Belgium</option>
<option value="Belize">Belize</option>
<option value="Benin">Benin</option>
<option value="Bermuda">Bermuda</option>
<option value="Bhutan">Bhutan</option>
<option value="Bolivia">Bolivia</option>
<option value="Bonaire">Bonaire</option>
<option value="Bosnia & Herzegovina">Bosnia & Herzegovina</option>
<option value="Botswana">Botswana</option>
<option value="Brazil">Brazil</option>
<option value="British Indian Ocean Ter">British Indian Ocean Ter</option>
<option value="Brunei">Brunei</option>
<option value="Bulgaria">Bulgaria</option>
<option value="Burkina Faso">Burkina Faso</option>
<option value="Burundi">Burundi</option>
<option value="Cambodia">Cambodia</option>
<option value="Cameroon">Cameroon</option>
<option value="Canada">Canada</option>
<option value="Canary Islands">Canary Islands</option>
<option value="Cape Verde">Cape Verde</option>
<option value="Cayman Islands">Cayman Islands</option>
<option value="Central African Republic">Central African Republic</option>
<option value="Chad">Chad</option>
<option value="Channel Islands">Channel Islands</option>
<option value="Chile">Chile</option>
<option value="China">China</option>
<option value="Christmas Island">Christmas Island</option>
<option value="Cocos Island">Cocos Island</option>
<option value="Colombia">Colombia</option>
<option value="Comoros">Comoros</option>
<option value="Congo">Congo</option>
<option value="Cook Islands">Cook Islands</option>
<option value="Costa Rica">Costa Rica</option>
<option value="Cote DIvoire">Cote DIvoire</option>
<option value="Croatia">Croatia</option>
<option value="Cuba">Cuba</option>
<option value="Curaco">Curacao</option>
<option value="Cyprus">Cyprus</option>
<option value="Czech Republic">Czech Republic</option>
<option value="Denmark">Denmark</option>
<option value="Djibouti">Djibouti</option>
<option value="Dominica">Dominica</option>
<option value="Dominican Republic">Dominican Republic</option>
<option value="East Timor">East Timor</option>
<option value="Ecuador">Ecuador</option>
<option value="Egypt">Egypt</option>
<option value="El Salvador">El Salvador</option>
<option value="Equatorial Guinea">Equatorial Guinea</option>
<option value="Eritrea">Eritrea</option>
<option value="Estonia">Estonia</option>
<option value="Ethiopia">Ethiopia</option>
<option value="Falkland Islands">Falkland Islands</option>
<option value="Faroe Islands">Faroe Islands</option>
<option value="Fiji">Fiji</option>
<option value="Finland">Finland</option>
<option value="France">France</option>
<option value="French Guiana">French Guiana</option>
<option value="French Polynesia">French Polynesia</option>
<option value="French Southern Ter">French Southern Ter</option>
<option value="Gabon">Gabon</option>
<option value="Gambia">Gambia</option>
<option value="Georgia">Georgia</option>
<option value="Germany">Germany</option>
<option value="Ghana">Ghana</option>
<option value="Gibraltar">Gibraltar</option>
<option value="Great Britain">Great Britain</option>
<option value="Greece">Greece</option>
<option value="Greenland">Greenland</option>
<option value="Grenada">Grenada</option>
<option value="Guadeloupe">Guadeloupe</option>
<option value="Guam">Guam</option>
<option value="Guatemala">Guatemala</option>
<option value="Guinea">Guinea</option>
<option value="Guyana">Guyana</option>
<option value="Haiti">Haiti</option>
<option value="Hawaii">Hawaii</option>
<option value="Honduras">Honduras</option>
<option value="Hong Kong">Hong Kong</option>
<option value="Hungary">Hungary</option>
<option value="Iceland">Iceland</option>
<option value="Indonesia">Indonesia</option>
<option value="India">India</option>
<option value="Iran">Iran</option>
<option value="Iraq">Iraq</option>
<option value="Ireland">Ireland</option>
<option value="Isle of Man">Isle of Man</option>
<option value="Israel">Israel</option>
<option value="Italy">Italy</option>
<option value="Jamaica">Jamaica</option>
<option value="Japan">Japan</option>
<option value="Jordan">Jordan</option>
<option value="Kazakhstan">Kazakhstan</option>
<option value="Kenya">Kenya</option>
<option value="Kiribati">Kiribati</option>
<option value="Korea North">Korea North</option>
<option value="Korea Sout">Korea South</option>
<option value="Kuwait">Kuwait</option>
<option value="Kyrgyzstan">Kyrgyzstan</option>
<option value="Laos">Laos</option>
<option value="Latvia">Latvia</option>
<option value="Lebanon">Lebanon</option>
<option value="Lesotho">Lesotho</option>
<option value="Liberia">Liberia</option>
<option value="Libya">Libya</option>
<option value="Liechtenstein">Liechtenstein</option>
<option value="Lithuania">Lithuania</option>
<option value="Luxembourg">Luxembourg</option>
<option value="Macau">Macau</option>
<option value="Macedonia">Macedonia</option>
<option value="Madagascar">Madagascar</option>
<option value="Malaysia">Malaysia</option>
<option value="Malawi">Malawi</option>
<option value="Maldives">Maldives</option>
<option value="Mali">Mali</option>
<option value="Malta">Malta</option>
<option value="Marshall Islands">Marshall Islands</option>
<option value="Martinique">Martinique</option>
<option value="Mauritania">Mauritania</option>
<option value="Mauritius">Mauritius</option>
<option value="Mayotte">Mayotte</option>
<option value="Mexico">Mexico</option>
<option value="Midway Islands">Midway Islands</option>
<option value="Moldova">Moldova</option>
<option value="Monaco">Monaco</option>
<option value="Mongolia">Mongolia</option>
<option value="Montserrat">Montserrat</option>
<option value="Morocco">Morocco</option>
<option value="Mozambique">Mozambique</option>
<option value="Myanmar">Myanmar</option>
<option value="Nambia">Nambia</option>
<option value="Nauru">Nauru</option>
<option value="Nepal">Nepal</option>
<option value="Netherland Antilles">Netherland Antilles</option>
<option value="Netherlands">Netherlands (Holland, Europe)</option>
<option value="Nevis">Nevis</option>
<option value="New Caledonia">New Caledonia</option>
<option value="New Zealand">New Zealand</option>
<option value="Nicaragua">Nicaragua</option>
<option value="Niger">Niger</option>
<option value="Nigeria">Nigeria</option>
<option value="Niue">Niue</option>
<option value="Norfolk Island">Norfolk Island</option>
<option value="Norway">Norway</option>
<option value="Oman">Oman</option>
<option value="Pakistan">Pakistan</option>
<option value="Palau Island">Palau Island</option>
<option value="Palestine">Palestine</option>
<option value="Panama">Panama</option>
<option value="Papua New Guinea">Papua New Guinea</option>
<option value="Paraguay">Paraguay</option>
<option value="Peru">Peru</option>
<option value="Phillipines">Philippines</option>
<option value="Pitcairn Island">Pitcairn Island</option>
<option value="Poland">Poland</option>
<option value="Portugal">Portugal</option>
<option value="Puerto Rico">Puerto Rico</option>
<option value="Qatar">Qatar</option>
<option value="Republic of Montenegro">Republic of Montenegro</option>
<option value="Republic of Serbia">Republic of Serbia</option>
<option value="Reunion">Reunion</option>
<option value="Romania">Romania</option>
<option value="Russia">Russia</option>
<option value="Rwanda">Rwanda</option>
<option value="St Barthelemy">St Barthelemy</option>
<option value="St Eustatius">St Eustatius</option>
<option value="St Helena">St Helena</option>
<option value="St Kitts-Nevis">St Kitts-Nevis</option>
<option value="St Lucia">St Lucia</option>
<option value="St Maarten">St Maarten</option>
<option value="St Pierre & Miquelon">St Pierre & Miquelon</option>
<option value="St Vincent & Grenadines">St Vincent & Grenadines</option>
<option value="Saipan">Saipan</option>
<option value="Samoa">Samoa</option>
<option value="Samoa American">Samoa American</option>
<option value="San Marino">San Marino</option>
<option value="Sao Tome & Principe">Sao Tome & Principe</option>
<option value="Saudi Arabia">Saudi Arabia</option>
<option value="Senegal">Senegal</option>
<option value="Seychelles">Seychelles</option>
<option value="Sierra Leone">Sierra Leone</option>
<option value="Singapore">Singapore</option>
<option value="Slovakia">Slovakia</option>
<option value="Slovenia">Slovenia</option>
<option value="Solomon Islands">Solomon Islands</option>
<option value="Somalia">Somalia</option>
<option value="South Africa">South Africa</option>
<option value="Spain">Spain</option>
<option value="Sri Lanka">Sri Lanka</option>
<option value="Sudan">Sudan</option>
<option value="Suriname">Suriname</option>
<option value="Swaziland">Swaziland</option>
<option value="Sweden">Sweden</option>
<option value="Switzerland">Switzerland</option>
<option value="Syria">Syria</option>
<option value="Tahiti">Tahiti</option>
<option value="Taiwan">Taiwan</option>
<option value="Tajikistan">Tajikistan</option>
<option value="Tanzania">Tanzania</option>
<option value="Thailand">Thailand</option>
<option value="Togo">Togo</option>
<option value="Tokelau">Tokelau</option>
<option value="Tonga">Tonga</option>
<option value="Trinidad & Tobago">Trinidad & Tobago</option>
<option value="Tunisia">Tunisia</option>
<option value="Turkey">Turkey</option>
<option value="Turkmenistan">Turkmenistan</option>
<option value="Turks & Caicos Is">Turks & Caicos Is</option>
<option value="Tuvalu">Tuvalu</option>
<option value="Uganda">Uganda</option>
<option value="United Kingdom">United Kingdom</option>
<option value="Ukraine">Ukraine</option>
<option value="United Arab Erimates">United Arab Emirates</option>
<option value="United States of America">United States of America</option>
<option value="Uraguay">Uruguay</option>
<option value="Uzbekistan">Uzbekistan</option>
<option value="Vanuatu">Vanuatu</option>
<option value="Vatican City State">Vatican City State</option>
<option value="Venezuela">Venezuela</option>
<option value="Vietnam">Vietnam</option>
<option value="Virgin Islands (Brit)">Virgin Islands (Brit)</option>
<option value="Virgin Islands (USA)">Virgin Islands (USA)</option>
<option value="Wake Island">Wake Island</option>
<option value="Wallis & Futana Is">Wallis & Futana Is</option>
<option value="Yemen">Yemen</option>
<option value="Zaire">Zaire</option>
<option value="Zambia">Zambia</option>
<option value="Zimbabwe">Zimbabwe</option>
</select>
</div>
</div>
<div class="add_del_btn_outer_comp" style="margin:0 4% 0 4%;">
<button class="add_new_frm_field_btn">
<img src="add-icon.png" alt="Add Company Button">
</button>
<button class="remove_node_btn_frm_field" disabled>
<img src="remove-icon.png" alt="Remove Company Button">
</button>
</div>
</div>
</div>
</div>
</body>
</html>
Any help in making them appear and function in the same way is highly appreciated. Thank you in advance!
My Fiddle: https://jsfiddle.net/30jwqfc5/

The first two select elements are instance of select2 and the later element is native html select. You need to instantiate select2 for the dynamically generated select elements after hitting the add company button, inside the click handler,
$('.mul-select').select2();
here is the fiddle https://jsfiddle.net/vpof3ab5/

React: Generate all date of birth select options

At the moment I've got a load of HTML in my script and its ugly to scroll past, is there a way I can generate all the options from 2019 to 1900 and then just loop over them?
<select
className='form--dob-year'
name='year'
onChange={onChange}
value={year}
>
<option value='0'>Year</option>
<option value='2019'>2019</option>
<option value='2018'>2018</option>
<option value='2017'>2017</option>
<option value='2016'>2016</option>
<option value='2015'>2015</option>
<option value='2014'>2014</option>
<option value='2013'>2013</option>
<option value='2012'>2012</option>
<option value='2011'>2011</option>
<option value='2010'>2010</option>
<option value='2009'>2009</option>
<option value='2008'>2008</option>
<option value='2007'>2007</option>
<option value='2006'>2006</option>
<option value='2005'>2005</option>
<option value='2004'>2004</option>
<option value='2003'>2003</option>
<option value='2002'>2002</option>
<option value='2001'>2001</option>
<option value='2000'>2000</option>
<option value='1999'>1999</option>
<option value='1998'>1998</option>
<option value='1997'>1997</option>
<option value='1996'>1996</option>
<option value='1995'>1995</option>
<option value='1994'>1994</option>
<option value='1993'>1993</option>
<option value='1992'>1992</option>
<option value='1991'>1991</option>
<option value='1990'>1990</option>
<option value='1989'>1989</option>
<option value='1988'>1988</option>
<option value='1987'>1987</option>
<option value='1986'>1986</option>
<option value='1985'>1985</option>
<option value='1984'>1984</option>
<option value='1983'>1983</option>
<option value='1982'>1982</option>
<option value='1981'>1981</option>
<option value='1980'>1980</option>
<option value='1979'>1979</option>
<option value='1978'>1978</option>
<option value='1977'>1977</option>
<option value='1976'>1976</option>
<option value='1975'>1975</option>
<option value='1974'>1974</option>
<option value='1973'>1973</option>
<option value='1972'>1972</option>
<option value='1971'>1971</option>
<option value='1970'>1970</option>
<option value='1969'>1969</option>
<option value='1968'>1968</option>
<option value='1967'>1967</option>
<option value='1966'>1966</option>
<option value='1965'>1965</option>
<option value='1964'>1964</option>
<option value='1963'>1963</option>
<option value='1962'>1962</option>
<option value='1961'>1961</option>
<option value='1960'>1960</option>
<option value='1959'>1959</option>
<option value='1958'>1958</option>
<option value='1957'>1957</option>
<option value='1956'>1956</option>
<option value='1955'>1955</option>
<option value='1954'>1954</option>
<option value='1953'>1953</option>
<option value='1952'>1952</option>
<option value='1951'>1951</option>
<option value='1950'>1950</option>
<option value='1949'>1949</option>
<option value='1948'>1948</option>
<option value='1947'>1947</option>
<option value='1946'>1946</option>
<option value='1945'>1945</option>
<option value='1944'>1944</option>
<option value='1943'>1943</option>
<option value='1942'>1942</option>
<option value='1941'>1941</option>
<option value='1940'>1940</option>
<option value='1939'>1939</option>
<option value='1938'>1938</option>
<option value='1937'>1937</option>
<option value='1936'>1936</option>
<option value='1935'>1935</option>
<option value='1934'>1934</option>
<option value='1933'>1933</option>
<option value='1932'>1932</option>
<option value='1931'>1931</option>
<option value='1930'>1930</option>
<option value='1929'>1929</option>
<option value='1928'>1928</option>
<option value='1927'>1927</option>
<option value='1926'>1926</option>
<option value='1925'>1925</option>
<option value='1924'>1924</option>
<option value='1923'>1923</option>
<option value='1922'>1922</option>
<option value='1921'>1921</option>
<option value='1920'>1920</option>
<option value='1919'>1919</option>
<option value='1918'>1918</option>
<option value='1917'>1917</option>
<option value='1916'>1916</option>
<option value='1915'>1915</option>
<option value='1914'>1914</option>
<option value='1913'>1913</option>
<option value='1912'>1912</option>
<option value='1911'>1911</option>
<option value='1910'>1910</option>
<option value='1909'>1909</option>
<option value='1908'>1908</option>
<option value='1907'>1907</option>
<option value='1906'>1906</option>
<option value='1905'>1905</option>
<option value='1904'>1904</option>
<option value='1903'>1903</option>
<option value='1902'>1902</option>
<option value='1901'>1901</option>
<option value='1900'>1900</option>
</select>
```

Just use a for loop. Create a function that returns an array of JSX.Element:
const generateYearOptions = () => {
const arr = [];
const startYear = 1900;
const endYear = new Date().getFullYear();
for (let i = endYear; i >= startYear; i--) {
arr.push(<option value={i}>{i}</option>);
}
return arr;
};
Then in your component:
<select
className='form--dob-year'
name='year'
onChange={onChange}
value={year}
>
<option value='0'>Year</option>
{generateYearOptions()}
</select>

How to Link to a Selected Drop-Down Item to Open a Web Page

I am trying to create a form which has city and social networking filter. I want to capture both the city and social networking value as i want to store the value and i want my form to redirect to social networking site on submit button. Suppose if i choose facebook, i want facebook homepage to open on submit button. My page is not getting redirected. here is my code
<script type="text/javascript">
function actionDef() {
var option_selected = $('purposeId').value();
console.log = option_selected;
if( option_selected=="gl" ) {
document.getElementById("search-form").action = "https://www.google.co.in/";
}
else if( option_selected=="y" ) {
document.getElementById("search-form").action = "https://in.yahoo.com/?p=us";
}
else if( option_selected=="fb" ) {
document.getElementById("search-form").action = "http://www.facebook.com/";
}
}
</script>
<form action="/" name="search-form" id="search-form" method="get" accept-charset="UTF-8" class="form-vertical">
<div class="city">
<label for="cityId" class="required">Enter your city</label>
<select id="cityId" name="cityId" data-prefill="location.cityId" class="form-control" placeholder="Enter a city">
<option value="9">Bangalore</option>
<option value="20">Chennai</option>
<option value="27">Faridabad</option>
<option value="28">Ghaziabad</option>
<option value="32">Gurgaon</option>
<option value="36">Howrah</option>
<option value="38">Hyderabad</option>
<option value="49">Kolkata</option>
<option value="57">Mumbai</option>
<option value="61">Navi Mumbai</option>
<option value="63" selected="selected">New Delhi</option>
<option value="89">Noida</option>
<option value="70">Pune</option>
<option value="76">Secunderabad</option>
<option value="79">Thane</option>
<option value="92">Agra</option>
<option value="1">Ahmedabad</option>
<option value="208">Ahmednagar</option>
<option value="93">Ajmer</option>
<option value="2">Akola</option>
<option value="295">Alappuzha</option>
<option value="209">Aligarh</option>
<option value="3">Allahabad</option>
<option value="140">Alleppey</option>
<option value="294">Aluva</option>
<option value="4">Alwar</option>
<option value="94">Ambala</option>
<option value="141">Amravati</option>
<option value="5">Amritsar</option>
<option value="6">Anand</option>
<option value="112">Anantapur</option>
<option value="255">Anantnag</option>
<option value="7">Ankleshwar</option>
<option value="210">Arakkonam</option>
<option value="256">Asansol</option>
<option value="8">Aurangabad</option>
<option value="297">Avadi</option>
<option value="211">Baddi</option>
<option value="302">Bagalkot</option>
<option value="9">Bangalore</option>
<option value="142">Bardoli</option>
<option value="10">Bareilly</option>
<option value="212">Barkathpura</option>
<option value="11">Baroda</option>
<option value="213">Batala</option>
<option value="214">Beawar</option>
<option value="12">Belgaum</option>
<option value="113">Bellary</option>
<option value="267">Berhampur</option>
<option value="13">Bharuch</option>
<option value="91">Bhatinda</option>
<option value="143">Bhavnagar</option>
<option value="257">Bhilai</option>
<option value="17">Bhilwara</option>
<option value="215">Bhimavaram</option>
<option value="144">Bhiwandi</option>
<option value="14">Bhopal</option>
<option value="15">Bhubaneshwar</option>
<option value="145">Bhuj</option>
<option value="288">Bidar</option>
<option value="301">Bijapur</option>
<option value="16">Bikaner</option>
<option value="216">Bilaspur</option>
<option value="146">Boisar</option>
<option value="258">Bokaro</option>
<option value="18">Calicut</option>
<option value="19">Chandigarh</option>
<option value="217">Chandrapur</option>
<option value="147">Changanacherry</option>
<option value="275">Chankheda</option>
<option value="20">Chennai</option>
<option value="96">Chidambaram</option>
<option value="290">Chitradurga</option>
<option value="300">Chokodi</option>
<option value="21">Cochin</option>
<option value="22">Coimbatore</option>
<option value="148">Cuddalore</option>
<option value="23">Cuttack</option>
<option value="149">Dahanu</option>
<option value="150">Dahej</option>
<option value="151">Daman</option>
<option value="273">Dausa</option>
<option value="152">Davangere</option>
<option value="105">Dehradun</option>
<option value="24">Delhi</option>
<option value="218">Derabassi</option>
<option value="25">Dewas</option>
<option value="95">Dhanbad</option>
<option value="97">Dharwad</option>
<option value="26">Dhule</option>
<option value="219">Dindigul</option>
<option value="220">Durg</option>
<option value="153">Durgapur</option>
<option value="98">Eluru</option>
<option value="106">Ernakulam</option>
<option value="99">Erode</option>
<option value="221">Faizabad</option>
<option value="27">Faridabad</option>
<option value="222">Firozabad</option>
<option value="154">Gandhidham</option>
<option value="253">Gandhinagar</option>
<option value="107">Gangtok</option>
<option value="28">Ghaziabad</option>
<option value="29">Goa</option>
<option value="299">Gokak</option>
<option value="259">Gorakhpur</option>
<option value="30">Gulbarga</option>
<option value="31">Guntur</option>
<option value="32">Gurgaon</option>
<option value="114">Guwahati</option>
<option value="33">Gwalior</option>
<option value="108">Haldwani</option>
<option value="223">Hapur</option>
<option value="155">Haridwar</option>
<option value="289">Harpanahalli</option>
<option value="129">Hassan</option>
<option value="287">Haveri</option>
<option value="264">Hazirabagh</option>
<option value="34">Himmatnagar</option>
<option value="109">Hissar</option>
<option value="156">Hoshiarpur</option>
<option value="157">Hospet</option>
<option value="35">Hosur</option>
<option value="36">Howrah</option>
<option value="37">Hubli</option>
<option value="38">Hyderabad</option>
<option value="293">Idukki</option>
<option value="39">Indore</option>
<option value="40">Jabalpur</option>
<option value="41">Jaipur</option>
<option value="45">Jalandhar</option>
<option value="131">Jalgaon</option>
<option value="224">Jalna</option>
<option value="260">Jammu</option>
<option value="42">Jamnagar</option>
<option value="43">Jamshedpur</option>
<option value="225">Jhansi</option>
<option value="44">Jodhpur</option>
<option value="46">Junagadh</option>
<option value="284">Kadappa</option>
<option value="110">Kakinada</option>
<option value="158">Kalka</option>
<option value="279">Kallakurichi</option>
<option value="159">Kalyan</option>
<option value="160">Kancheepuran</option>
<option value="100">Kankroli</option>
<option value="161">Kannur</option>
<option value="47">Kanpur</option>
<option value="132">Kanyakumari</option>
<option value="162">Kapurthala</option>
<option value="163">Karad</option>
<option value="164">Karaikudi</option>
<option value="226">Karimnagar</option>
<option value="111">Karnal</option>
<option value="165">Karur</option>
<option value="286">Karwar</option>
<option value="283">Kasaragode</option>
<option value="227">Katni</option>
<option value="228">Khammam</option>
<option value="266">Khandwa</option>
<option value="166">Khanna</option>
<option value="265">Khargone</option>
<option value="305">Kolar</option>
<option value="48">Kolhapur</option>
<option value="49">Kolkata</option>
<option value="167">Kollam</option>
<option value="50">Kota</option>
<option value="90">Kottayam</option>
<option value="168">Kovilatti</option>
<option value="115">Kozhikode</option>
<option value="169">Kumbakonam</option>
<option value="116">Kurnool</option>
<option value="170">Kurukshetra</option>
<option value="136">Lathur</option>
<option value="51">Lucknow</option>
<option value="52">Ludhiana</option>
<option value="53">Madurai</option>
<option value="254">Mahabubnagar</option>
<option value="54">Mahad</option>
<option value="278">Malappuram</option>
<option value="282">Mandya</option>
<option value="55">Mangalore</option>
<option value="139">Mangan</option>
<option value="101">Manipal</option>
<option value="171">Manjeri</option>
<option value="130">Mansarovar</option>
<option value="172">Mapusa</option>
<option value="229">Mathura</option>
<option value="292">Mavelikara</option>
<option value="173">Meerut</option>
<option value="56">Mehsana</option>
<option value="174">Moga</option>
<option value="137">Mohali</option>
<option value="175">Morvi</option>
<option value="298">Mudhol</option>
<option value="57">Mumbai</option>
<option value="58">Mysore</option>
<option value="176">Nabha</option>
<option value="177">Nadiad</option>
<option value="117">Nagercoil</option>
<option value="59">Nagpur</option>
<option value="230">Nanded</option>
<option value="231">Nandyal</option>
<option value="277">Narsipatnam</option>
<option value="60">Nashik</option>
<option value="61">Navi Mumbai</option>
<option value="178">Navsari</option>
<option value="304">Neelamangala</option>
<option value="62">Nellore</option>
<option value="63">New Delhi</option>
<option value="232">Nizamabad</option>
<option value="89">Noida</option>
<option value="274">Nokha</option>
<option value="233">Ongole</option>
<option value="179">Palakkad</option>
<option value="261">Palanpur</option>
<option value="268">Palghar</option>
<option value="234">Pali</option>
<option value="138">Panchkulla</option>
<option value="180">Panipat</option>
<option value="181">Panjim</option>
<option value="64">Panvel</option>
<option value="235">Parbhani</option>
<option value="182">Patalganga</option>
<option value="183">Pathanamthitta</option>
<option value="236">Pathankot</option>
<option value="65">Patiala</option>
<option value="66">Patna</option>
<option value="67">Pen</option>
<option value="184">Phagwara</option>
<option value="68">Pithampur</option>
<option value="185">Pollachi</option>
<option value="186">Ponda</option>
<option value="102">Pondichery</option>
<option value="69">Porbunder</option>
<option value="296">Poruru</option>
<option value="187">Porvorim</option>
<option value="188">Pudukottai</option>
<option value="70">Pune</option>
<option value="237">Raichur</option>
<option value="238">Raigarh</option>
<option value="71">Raipur</option>
<option value="72">Rajkot</option>
<option value="73">Rajmundry</option>
<option value="239">Rajnandgaon</option>
<option value="189">Rajpura</option>
<option value="74">Ranchi</option>
<option value="240">Ranipet</option>
<option value="75">Ratlam</option>
<option value="133">Ratnagiri</option>
<option value="190">Rewari</option>
<option value="241">Rohtak</option>
<option value="191">Ropar</option>
<option value="118">Rourkela</option>
<option value="192">Rudrapur</option>
<option value="242">Saharanpur</option>
<option value="103">Salem</option>
<option value="285">Sangareddy</option>
<option value="134">Sangli</option>
<option value="193">Sangrur</option>
<option value="135">Satara</option>
<option value="76">Secunderabad</option>
<option value="119">Shimla</option>
<option value="243">Shimoga</option>
<option value="262">Sikar</option>
<option value="120">Silchar</option>
<option value="121">Siliguri</option>
<option value="77">Silvassa</option>
<option value="244">Sirsa</option>
<option value="245">Sitapur</option>
<option value="194">Sivakasi</option>
<option value="195">Sohana</option>
<option value="246">Solan</option>
<option value="196">Solapur</option>
<option value="197">Sonepat</option>
<option value="247">Sri Ganganagar</option>
<option value="248">Srikakulam</option>
<option value="263">Srinagar</option>
<option value="78">Surat</option>
<option value="269">Swargate</option>
<option value="249">Tadepalligudem</option>
<!--<option value="250">Tamilnadu</option> -->
<option value="122">Tanjore</option>
<option value="79">Thane</option>
<option value="198">Thanjavur</option>
<option value="281">Theni</option>
<option value="123">Thiruvananthapuram</option>
<option value="280">Thiruvannamalai</option>
<option value="291">Thripunithura</option>
<option value="124">Thrissur</option>
<option value="125">Tirunelveli</option>
<option value="126">Tirupathi</option>
<option value="251">Tirupur</option>
<option value="199">Tiruvalla</option>
<option value="272">Tonk</option>
<option value="104">Trichur</option>
<option value="80">Trichy</option>
<option value="81">Trivandrum</option>
<option value="200">Tumkur</option>
<option value="82">Udaipur</option>
<option value="201">Udupi</option>
<option value="83">Ujjain</option>
<option value="202">Unjha</option>
<option value="84">Valsad</option>
<option value="85">Vapi</option>
<option value="86">Varanasi</option>
<option value="276">Vastral</option>
<option value="127">Vellore</option>
<option value="203">Veraval</option>
<option value="87">Vijayawada</option>
<option value="204">Villupuram</option>
<option value="205">Virudhachalam</option>
<option value="206">Virudhunagar</option>
<option value="88">Vizag</option>
<option value="128">Warangal</option>
<option value="271">Wardha</option>
<option value="252">Yamunanagar</option>
<option value="270">Yavatmal</option>
<option value="303">Yelanka</option>
<option value="207">Zirakpur</option>
</select>
<span id="city-not-selected-error" class="help-inline"> </span> <i class="fa fa-angle-down" aria-hidden="true"></i>
</div>
<div class="purpose">
<label for="purposeId" class="required">Enter Type</label>
<select id="purposeId" name="purposeId" class="form-control" placeholder="Selelct Type" onChange="actionDef()">
<option value="select_purpose" selected="selected">Selelct Type</option>
<option value="1" id="gl">Google</option>
<option value="2" id="y">Yahoo</option>
<option value="3" id="fb">Facebook</option>
</select>
<span id="city-not-selected-error" class="help-inline"> </span> <i class="fa fa-angle-down" aria-hidden="true"></i> <span id="purpose-not-selected-error" class="help-inline"> </span>
</div>
<div class="show-ofr">
<input type="submit" name="button" class="btn btn-primary btn-block">
</div>
</form>

try the below code, the problem is the way you process your value from select field.
JavaScript
<script src="http://code.jquery.com/jquery-3.0.0.min.js"></script>
<script>
jQuery(function($) {
// bind change event to select
$('#purposeId').on('change', function() {
var url = $(this).val(); // get selected value
alert(url);
if (url == "1") {
document.getElementById("search-form").action = "https://www.google.co.in/";
} else if (url == "2") {
document.getElementById("search-form").action = "https://in.yahoo.com/?p=us";
} else if (url == "3") {
document.getElementById("search-form").action = "http://www.facebook.com/";
}
});
});
</script>
HTML
<form action="" name="search-form" id="search-form" method="get" accept-charset="UTF-8" class="form-vertical">
<div class="city">
<label for="cityId" class="required">Enter your city</label>
<select id="cityId" name="cityId" data-prefill="location.cityId" class="form-control" placeholder="Enter a city">
<option value="88">Vizag</option>
<option value="128">Warangal</option>
<option value="271">Wardha</option>
<option value="252">Yamunanagar</option>
<option value="270">Yavatmal</option>
<option value="303">Yelanka</option>
<option value="207">Zirakpur</option>
</select>
<span id="city-not-selected-error" class="help-inline"></span>
<i class="fa fa-angle-down" aria-hidden="true"></i>
</div>
<div class="purpose">
<label for="purposeId" class="required">Enter Type</label>
<select id="purposeId" name="purposeId" class="form-control" placeholder="Selelct Type">
<option value="select_purpose" selected="selected">Selelct Type</option>
<option value="1" id="gl">Google</option>
<option value="2" id="y">Yahoo</option>
<option value="3" id="fb">Facebook</option>
</select>
<span id="city-not-selected-error" class="help-inline"> </span> <i class="fa fa-angle-down" aria-hidden="true"></i> <span id="purpose-not-selected-error" class="help-inline"> </span>
</div>
<div class="show-ofr">
<input type="submit" name="button" class="btn btn-primary btn-block">
</div>
</form>

How do I grab the option text from a value

So I have this snippet of HTML:
<div class="col-md-3">
<div class="form-group">
<select id="billcountry" class="form-control" name="bill_country" onchange="alert(this.value); console.log(this);" tabindex="16">
<option value="USA">United States</option>
<option value="CAN">Canada</option>
<option value="AFGH">Afghanistan</option>
<option value="ALBA">Albania</option>
<option value="ALGE">Algeria</option>
<option value="ANGO">Angola</option>
<option value="ANGU">Anguilla</option>
<option value="ANTA">Antartica</option>
<option value="ANTI">Antigua & Barbuda</option>
<option value="ARGE">Argentina</option>
<option value="ARME">Armenia</option>
<option value="ARUB">Aruba</option>
<option value="AUST">Austria</option>
<option value="AUS">Australia</option>
<option value="AZER">Azerbaijan</option>
<option value="BAHA">Bahamas</option>
<option value="BAHR">Bahrain</option>
<option value="BANG">Bangladesh</option>
<option value="BARB">Barbados</option>
<option value="BELA">Belarus</option>
<option value="BELG">Belgium</option>
<option value="BELI">Belize</option>
<option value="BENI">Benin</option>
<option value="BERM">Bermuda</option>
<option value="BHUT">Bhutan</option>
<option value="BOLI">Bolivia</option>
<option value="BORN">Borneo</option>
<option value="BOSN">Bosnia</option>
<option value="BOTS">Botswana</option>
<option value="BRAZ">Brazil</option>
<option value="BRIO">British Indian Ocean Territories</option>
<option value="BRVI">British Virgin Islands</option>
<option value="BRUN">Brunei</option>
<option value="BULG">Bulgaria</option>
<option value="BURK">Burkina Faso</option>
<option value="BURU">Burundi</option>
<option value="CAMB">Cambodia</option>
<option value="CAME">Cameroon</option>
<option value="CAPV">Cape Verde Island</option>
<option value="CAYM">Cayman Islands</option>
<option value="CAFR">Central African Republic</option>
<option value="CHAD">Chad</option>
<option value="CHIL">Chile</option>
<option value="CHIN">China</option>
<option value="COLO">Colombia</option>
<option value="COMO">Comoros</option>
<option value="CONG">Congo</option>
<option value="COST">Costa Rica</option>
<option value="IVOR">Cote D'ivoire</option>
<option value="CROA">Croatia</option>
<option value="CUBA">Cuba</option>
<option value="CYPR">Cyprus</option>
<option value="CZEC">Czech Republic</option>
<option value="DENM">Denmark</option>
<option value="DJIB">Djibouti</option>
<option value="DOMI">Dominican Republic</option>
<option value="ECUA">Ecuador</option>
<option value="EGYP">Egypt</option>
<option value="ELSA">El Salvador</option>
<option value="ENGL">England</option>
<option value="EQGU">Equatorial Guinea</option>
<option value="ERIT">Eritrea</option>
<option value="ESTO">Estonia</option>
<option value="ETHI">Ethiopia</option>
<option value="FALK">Falkland Islands</option>
<option value="FARO">Faroe Islands</option>
<option value="FIJI">Fiji</option>
<option value="FINL">Finland</option>
<option value="FRAN">France</option>
<option value="FRGU">French Guiana</option>
<option value="POLY">French Polynesia</option>
<option value="FRST">French So Territories</option>
<option value="GABO">Gabon</option>
<option value="GAMB">Gambia</option>
<option value="GEOR">Georgia</option>
<option value="GERM">Germany</option>
<option value="GHAN">Ghana</option>
<option value="GIBR">Gibraltar</option>
<option value="GREC">Greece</option>
<option value="GREE">Greenland</option>
<option value="GREN">Grenada</option>
<option value="GUAD">Guadeloupe</option>
<option value="GUAT">Guatemala</option>
<option value="GUIB">Guinea-bissau</option>
<option value="GUYA">Guyana</option>
<option value="HAIT">Haiti</option>
<option value="HOND">Honduras</option>
<option value="HONG">Hong Kong</option>
<option value="HUNG">Hungary</option>
<option value="ICEL">Iceland</option>
<option value="INDI">India</option>
<option value="INDO">Indonesia</option>
<option value="IRAN">Iran</option>
<option value="IRAQ">Iraq</option>
<option value="IREL">Ireland</option>
<option value="ISRA">Israel</option>
<option value="ITAL">Italy</option>
<option value="JAMA">Jamaica</option>
<option value="JAPA">Japan</option>
<option value="JORD">Jordan</option>
<option value="KAZA">Kazakhstan</option>
<option value="KENY">Kenya</option>
<option value="KUWA">Kuwait</option>
<option value="KYRG">Kyrgyzstan</option>
<option value="LAOS">Laos</option>
<option value="LATV">Latvia</option>
<option value="LEBA">Lebanon</option>
<option value="LESO">Lesotho</option>
<option value="LIBE">Liberia</option>
<option value="LIBY">Libya</option>
<option value="LIEC">Liechtenstien</option>
<option value="LITH">Lithuania</option>
<option value="LUXE">Luxembourg</option>
<option value="MACA">Macau</option>
<option value="MACE">Macedonia</option>
<option value="MADA">Madagascar</option>
<option value="MALW">Malawi</option>
<option value="MALA">Malaysia</option>
<option value="MALD">Maldives</option>
<option value="MALI">Mali</option>
<option value="MALT">Malta</option>
<option value="MART">Martinique</option>
<option value="MAUA">Mauritania</option>
<option value="MAUS">Mauritius</option>
<option value="MAYO">Mayotte</option>
<option value="MEXI">Mexico</option>
<option value="MOLD">Moldova</option>
<option value="MONA">Monaco</option>
<option value="MONG">Mongolia</option>
<option value="MONT">Montserrat</option>
<option value="MORO">Morocco</option>
<option value="MOZA">Mozambique</option>
<option value="MYAN">Myanmar</option>
<option value="NIRE">N Ireland</option>
<option value="NAMI">Namibia</option>
<option value="NEPA">Nepal</option>
<option value="NETH">Netherlands</option>
<option value="NANT">Netherlands Antilles</option>
<option value="NCAL">New Caledonia</option>
<option value="NGUI">New Guinea</option>
<option value="NZEA">New Zealand</option>
<option value="NICA">Nicaragua</option>
<option value="NIGE">Niger</option>
<option value="NIGA">Nigeria</option>
<option value="NKOR">North Korea</option>
<option value="NORW">Norway</option>
<option value="OMAN">Oman</option>
<option value="PAKI">Pakistan</option>
<option value="PANA">Panama</option>
<option value="PAPU">Papua New Guinea</option>
<option value="PARA">Paraguay</option>
<option value="PERU">Peru</option>
<option value="PHIL">Philippines</option>
<option value="POLA">Poland</option>
<option value="PORT">Portugal</option>
<option value="ANDO">Principality Of Andorra</option>
<option value="QATA">Qatar</option>
<option value="ROMA">Romania</option>
<option value="RUSS">Russia</option>
<option value="RWAN">Rwanda</option>
<option value="SGEO">S Georgia & S Sandwich Isls</option>
<option value="SOMO">Samoa (western)</option>
<option value="SANM">San Marino</option>
<option value="SAOT">Sao Tome & Principe</option>
<option value="SAUD">Saudi Arabia</option>
<option value="SCOT">Scotland</option>
<option value="SENE">Senegal</option>
<option value="SEYC">Seychelles Island</option>
<option value="SIER">Sierra Leone</option>
<option value="SING">Singapore</option>
<option value="SLVK">Slovakia</option>
<option value="SLVN">Slovenia</option>
<option value="SOLO">Solomon Island</option>
<option value="SOMA">Somalia</option>
<option value="SAFR">South Africa</option>
<option value="SKOR">South Korea</option>
<option value="SPAI">Spain</option>
<option value="SRIL">Sri Lanka</option>
<option value="STHL">St Helena</option>
<option value="STKN">St Kitts & Nevis</option>
<option value="STLU">St Lucia</option>
<option value="STPM">St Pierre & Miquelon</option>
<option value="STVG">St Vincent & The Grenadines</option>
<option value="SUDA">Sudan</option>
<option value="SURI">Suriname</option>
<option value="SWAZ">Swaziland</option>
<option value="SWED">Sweden</option>
<option value="SWIT">Switzerland</option>
<option value="SYRI">Syria</option>
<option value="TAIW">Taiwan</option>
<option value="TANZ">Tanzania</option>
<option value="THAI">Thailand</option>
<option value="TOGO">Togo</option>
<option value="TONG">Tonga</option>
<option value="TRIN">Trinidad & Tobago</option>
<option value="TUNI">Tunisia</option>
<option value="TURK">Turkey</option>
<option value="TURC">Turks & Caicos Islands</option>
<option value="UGAN">Uganda</option>
<option value="UKRA">Ukraine</option>
<option value="UAE">United Arab Emirates</option>
<option value="URUG">Uruguay</option>
<option value="UZBE">Uzbekistan</option>
<option value="VATI">Vatican</option>
<option value="VENE">Venezuela</option>
<option value="VIET">Vietnam</option>
<option value="WALE">Wales</option>
<option value="WFIS">Wallis & Futuna Islands</option>
<option value="SAHA">Western Sahara</option>
<option value="WSAM">Western Samoa</option>
<option value="YEME">Yemen</option>
<option value="YUGO">Yugoslavia</option>
<option value="ZAIR">Zaire</option>
<option value="ZAMB">Zambia</option>
<option value="ZIMB">Zimbabwe</option>
</select>
</div>
</div>
And as you can see, when the value of the <select> changes, the new value is passed to an alert currently.
I have looked all over for a solution (without jQuery to grab the options text based solely off of the value.
So if the select were changed to value USA, I have attempted (and failed) at getting the words United States
Any thoughts on how to efficiently go about this without using jQuery or having to loop through each option and checking its value and then grabbing its innerHTML if it matches?
**EDIT: ** I am searching for the actual TEXT and not the VALUE. Why this isn't duplicate.

Avoid using JavaScript inside and element.
You can try this:
var select = document.getElementById('billcountry');
select.addEventListener('change', function () {
console.log(this.options[this.selectedIndex].text);
});

You can use this to get the text of the selected element:
this[this.selectedIndex].innerHTML
<div class="col-md-3">
<div class="form-group">
<select id="billcountry" class="form-control" name="bill_country" onchange="alert(this[this.selectedIndex].innerHTML); console.log(this);" tabindex="16">
<option value="USA">United States</option>
<option value="CAN">Canada</option>
<option value="AFGH">Afghanistan</option>
<option value="ALBA">Albania</option>
<option value="ALGE">Algeria</option>
<option value="ANGO">Angola</option>
<option value="ANGU">Anguilla</option>
<option value="ANTA">Antartica</option>
<option value="ANTI">Antigua & Barbuda</option>
<option value="ARGE">Argentina</option>
<option value="ARME">Armenia</option>
<option value="ARUB">Aruba</option>
<option value="AUST">Austria</option>
<option value="AUS">Australia</option>
<option value="AZER">Azerbaijan</option>
<option value="BAHA">Bahamas</option>
<option value="BAHR">Bahrain</option>
<option value="BANG">Bangladesh</option>
<option value="BARB">Barbados</option>
<option value="BELA">Belarus</option>
<option value="BELG">Belgium</option>
<option value="BELI">Belize</option>
<option value="BENI">Benin</option>
<option value="BERM">Bermuda</option>
<option value="BHUT">Bhutan</option>
<option value="BOLI">Bolivia</option>
<option value="BORN">Borneo</option>
<option value="BOSN">Bosnia</option>
<option value="BOTS">Botswana</option>
<option value="BRAZ">Brazil</option>
<option value="BRIO">British Indian Ocean Territories</option>
<option value="BRVI">British Virgin Islands</option>
<option value="BRUN">Brunei</option>
<option value="BULG">Bulgaria</option>
<option value="BURK">Burkina Faso</option>
<option value="BURU">Burundi</option>
<option value="CAMB">Cambodia</option>
<option value="CAME">Cameroon</option>
<option value="CAPV">Cape Verde Island</option>
<option value="CAYM">Cayman Islands</option>
<option value="CAFR">Central African Republic</option>
<option value="CHAD">Chad</option>
<option value="CHIL">Chile</option>
<option value="CHIN">China</option>
<option value="COLO">Colombia</option>
<option value="COMO">Comoros</option>
<option value="CONG">Congo</option>
<option value="COST">Costa Rica</option>
<option value="IVOR">Cote D'ivoire</option>
<option value="CROA">Croatia</option>
<option value="CUBA">Cuba</option>
<option value="CYPR">Cyprus</option>
<option value="CZEC">Czech Republic</option>
<option value="DENM">Denmark</option>
<option value="DJIB">Djibouti</option>
<option value="DOMI">Dominican Republic</option>
<option value="ECUA">Ecuador</option>
<option value="EGYP">Egypt</option>
<option value="ELSA">El Salvador</option>
<option value="ENGL">England</option>
<option value="EQGU">Equatorial Guinea</option>
<option value="ERIT">Eritrea</option>
<option value="ESTO">Estonia</option>
<option value="ETHI">Ethiopia</option>
<option value="FALK">Falkland Islands</option>
<option value="FARO">Faroe Islands</option>
<option value="FIJI">Fiji</option>
<option value="FINL">Finland</option>
<option value="FRAN">France</option>
<option value="FRGU">French Guiana</option>
<option value="POLY">French Polynesia</option>
<option value="FRST">French So Territories</option>
<option value="GABO">Gabon</option>
<option value="GAMB">Gambia</option>
<option value="GEOR">Georgia</option>
<option value="GERM">Germany</option>
<option value="GHAN">Ghana</option>
<option value="GIBR">Gibraltar</option>
<option value="GREC">Greece</option>
<option value="GREE">Greenland</option>
<option value="GREN">Grenada</option>
<option value="GUAD">Guadeloupe</option>
<option value="GUAT">Guatemala</option>
<option value="GUIB">Guinea-bissau</option>
<option value="GUYA">Guyana</option>
<option value="HAIT">Haiti</option>
<option value="HOND">Honduras</option>
<option value="HONG">Hong Kong</option>
<option value="HUNG">Hungary</option>
<option value="ICEL">Iceland</option>
<option value="INDI">India</option>
<option value="INDO">Indonesia</option>
<option value="IRAN">Iran</option>
<option value="IRAQ">Iraq</option>
<option value="IREL">Ireland</option>
<option value="ISRA">Israel</option>
<option value="ITAL">Italy</option>
<option value="JAMA">Jamaica</option>
<option value="JAPA">Japan</option>
<option value="JORD">Jordan</option>
<option value="KAZA">Kazakhstan</option>
<option value="KENY">Kenya</option>
<option value="KUWA">Kuwait</option>
<option value="KYRG">Kyrgyzstan</option>
<option value="LAOS">Laos</option>
<option value="LATV">Latvia</option>
<option value="LEBA">Lebanon</option>
<option value="LESO">Lesotho</option>
<option value="LIBE">Liberia</option>
<option value="LIBY">Libya</option>
<option value="LIEC">Liechtenstien</option>
<option value="LITH">Lithuania</option>
<option value="LUXE">Luxembourg</option>
<option value="MACA">Macau</option>
<option value="MACE">Macedonia</option>
<option value="MADA">Madagascar</option>
<option value="MALW">Malawi</option>
<option value="MALA">Malaysia</option>
<option value="MALD">Maldives</option>
<option value="MALI">Mali</option>
<option value="MALT">Malta</option>
<option value="MART">Martinique</option>
<option value="MAUA">Mauritania</option>
<option value="MAUS">Mauritius</option>
<option value="MAYO">Mayotte</option>
<option value="MEXI">Mexico</option>
<option value="MOLD">Moldova</option>
<option value="MONA">Monaco</option>
<option value="MONG">Mongolia</option>
<option value="MONT">Montserrat</option>
<option value="MORO">Morocco</option>
<option value="MOZA">Mozambique</option>
<option value="MYAN">Myanmar</option>
<option value="NIRE">N Ireland</option>
<option value="NAMI">Namibia</option>
<option value="NEPA">Nepal</option>
<option value="NETH">Netherlands</option>
<option value="NANT">Netherlands Antilles</option>
<option value="NCAL">New Caledonia</option>
<option value="NGUI">New Guinea</option>
<option value="NZEA">New Zealand</option>
<option value="NICA">Nicaragua</option>
<option value="NIGE">Niger</option>
<option value="NIGA">Nigeria</option>
<option value="NKOR">North Korea</option>
<option value="NORW">Norway</option>
<option value="OMAN">Oman</option>
<option value="PAKI">Pakistan</option>
<option value="PANA">Panama</option>
<option value="PAPU">Papua New Guinea</option>
<option value="PARA">Paraguay</option>
<option value="PERU">Peru</option>
<option value="PHIL">Philippines</option>
<option value="POLA">Poland</option>
<option value="PORT">Portugal</option>
<option value="ANDO">Principality Of Andorra</option>
<option value="QATA">Qatar</option>
<option value="ROMA">Romania</option>
<option value="RUSS">Russia</option>
<option value="RWAN">Rwanda</option>
<option value="SGEO">S Georgia & S Sandwich Isls</option>
<option value="SOMO">Samoa (western)</option>
<option value="SANM">San Marino</option>
<option value="SAOT">Sao Tome & Principe</option>
<option value="SAUD">Saudi Arabia</option>
<option value="SCOT">Scotland</option>
<option value="SENE">Senegal</option>
<option value="SEYC">Seychelles Island</option>
<option value="SIER">Sierra Leone</option>
<option value="SING">Singapore</option>
<option value="SLVK">Slovakia</option>
<option value="SLVN">Slovenia</option>
<option value="SOLO">Solomon Island</option>
<option value="SOMA">Somalia</option>
<option value="SAFR">South Africa</option>
<option value="SKOR">South Korea</option>
<option value="SPAI">Spain</option>
<option value="SRIL">Sri Lanka</option>
<option value="STHL">St Helena</option>
<option value="STKN">St Kitts & Nevis</option>
<option value="STLU">St Lucia</option>
<option value="STPM">St Pierre & Miquelon</option>
<option value="STVG">St Vincent & The Grenadines</option>
<option value="SUDA">Sudan</option>
<option value="SURI">Suriname</option>
<option value="SWAZ">Swaziland</option>
<option value="SWED">Sweden</option>
<option value="SWIT">Switzerland</option>
<option value="SYRI">Syria</option>
<option value="TAIW">Taiwan</option>
<option value="TANZ">Tanzania</option>
<option value="THAI">Thailand</option>
<option value="TOGO">Togo</option>
<option value="TONG">Tonga</option>
<option value="TRIN">Trinidad & Tobago</option>
<option value="TUNI">Tunisia</option>
<option value="TURK">Turkey</option>
<option value="TURC">Turks & Caicos Islands</option>
<option value="UGAN">Uganda</option>
<option value="UKRA">Ukraine</option>
<option value="UAE">United Arab Emirates</option>
<option value="URUG">Uruguay</option>
<option value="UZBE">Uzbekistan</option>
<option value="VATI">Vatican</option>
<option value="VENE">Venezuela</option>
<option value="VIET">Vietnam</option>
<option value="WALE">Wales</option>
<option value="WFIS">Wallis & Futuna Islands</option>
<option value="SAHA">Western Sahara</option>
<option value="WSAM">Western Samoa</option>
<option value="YEME">Yemen</option>
<option value="YUGO">Yugoslavia</option>
<option value="ZAIR">Zaire</option>
<option value="ZAMB">Zambia</option>
<option value="ZIMB">Zimbabwe</option>
</select> </div>
</div>

You can use the following code to achieve that. this (the select) contains an attribute options with all the option elements. It also has the current selectedIndex.
<select id="billcountry" class="form-control" name="bill_country" onchange="alert(this.options[this.selectedIndex].text); console.log(this);" tabindex="16">
Jsfiddle

You could use the element.querySelector['value='] to grab the option element by value and then grab the innerHTML property.
According to MDN, element.querySelector() "returns the first element that is a descendant of the element on which it is invoked that matches the specified group of selectors." So it will have to search through each option element until it finds what it's looking for.
Here's an example:
HTML
<select name="color" id="color" onChange="handleChange.call(this)">
<option value="blue">Blue</option>
<option value="red">Red</option>
<option value="green">Green</option>
</select>
JS Change Function
function handleChange(){
console.log(document.querySelector("[value=" + this.value + "]").innerHTML);
}

GoogleMaps, visualize Country based on a CountryCode

I have a lists of CountryCodes, I would like to generate GoogleMap visualisations based on these CountryCodes. For example for China I have "CN" I would like to be able to generate an visualisation like this:
https://goo.gl/maps/zyPk7
Center and zoom must to be automatic, due to the only information I have is the CountryCode
 Update
I have tried with this code: JSFiddle playground, I can centre and zoom based on CountryName but not based on CountryCode.
geocoder.geocode({"address": address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
map.setCenter(results[0].geometry.location);
map.fitBounds(results[0].geometry.bounds);
} else {
alert('Geocode was not successful for the following reason: ' + status);
}
});
When address is a CountryName it works, but I don't know how to make it works when address is a CountryCode.

Geocoding the 2 character ISO 3166 code plus the string "country" works for me:
var geocoder;
var map;
function initialize() {
geocoder = new google.maps.Geocoder();
var latlng = new google.maps.LatLng(-34.397, 150.644);
var mapOptions = {
zoom: 8,
center: latlng
}
map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
}
google.maps.event.addDomListener(window, 'load', initialize);
function codeAddress(selectItem) {
var address = document.getElementById('addr_sel')[selectItem.selectedIndex].value;
geocoder.geocode({
"address": address + " country"
}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
map.setCenter(results[0].geometry.location);
map.fitBounds(results[0].geometry.bounds);
document.getElementById('address').value = results[0].formatted_address;
} else {
alert('Geocode was not successful for the following reason: ' + status);
}
});
}
$("#geocode_button").on("click", codeAddress);
initialize();
#map-canvas {
height: 400px;
margin: 0px;
padding: 0px;
border: 1px solid red;
}
<script src="https://maps.googleapis.com/maps/api/js"></script>
<div id="panel">
<input id="address" type="textbox" value="Sydney, NSW" />
</div>
<div id="map-canvas"></div>
<select id="addr_sel" onchange="codeAddress(this)">
<!-- ISO 3166 codes from http://simple.wikipedia.org/wiki/ISO_3166-1 -->
<option value="AF">AF</option>
<option value="AX">AX</option>
<option value="AL">AL</option>
<option value="DZ">DZ</option>
<option value="AS">AS</option>
<option value="AD">AD</option>
<option value="AO">AO</option>
<option value="AI">AI</option>
<option value="AQ">AQ</option>
<option value="AG">AG</option>
<option value="AR">AR</option>
<option value="AM">AM</option>
<option value="AW">AW</option>
<option value="AU">AU</option>
<option value="AT">AT</option>
<option value="AZ">AZ</option>
<option value="BS">BS</option>
<option value="BH">BH</option>
<option value="BD">BD</option>
<option value="BB">BB</option>
<option value="BY">BY</option>
<option value="BE">BE</option>
<option value="BZ">BZ</option>
<option value="BJ">BJ</option>
<option value="BM">BM</option>
<option value="BT">BT</option>
<option value="BO">BO</option>
<option value="BA">BA</option>
<option value="BW">BW</option>
<option value="BV">BV</option>
<option value="BR">BR</option>
<option value="IO">IO</option>
<option value="BN">BN</option>
<option value="BG">BG</option>
<option value="BF">BF</option>
<option value="BI">BI</option>
<option value="KH">KH</option>
<option value="CM">CM</option>
<option value="CA">CA</option>
<option value="CV">CV</option>
<option value="KY">KY</option>
<option value="CF">CF</option>
<option value="TD">TD</option>
<option value="CL">CL</option>
<option value="CN">CN</option>
<option value="CX">CX</option>
<option value="CC">CC</option>
<option value="CO">CO</option>
<option value="KM">KM</option>
<option value="CG">CG</option>
<option value="CD">CD</option>
<option value="CK">CK</option>
<option value="CR">CR</option>
<option value="CI">CI</option>
<option value="HR">HR</option>
<option value="CU">CU</option>
<option value="CY">CY</option>
<option value="CZ">CZ</option>
<option value="DK">DK</option>
<option value="DJ">DJ</option>
<option value="DM">DM</option>
<option value="DO">DO</option>
<option value="EC">EC</option>
<option value="EG">EG</option>
<option value="SV">SV</option>
<option value="GQ">GQ</option>
<option value="ER">ER</option>
<option value="EE">EE</option>
<option value="ET">ET</option>
<option value="FK">FK</option>
<option value="FO">FO</option>
<option value="FJ">FJ</option>
<option value="FI">FI</option>
<option value="FR">FR</option>
<option value="GF">GF</option>
<option value="PF">PF</option>
<option value="TF">TF</option>
<option value="GA">GA</option>
<option value="GM">GM</option>
<option value="GE">GE</option>
<option value="DE">DE</option>
<option value="GH">GH</option>
<option value="GI">GI</option>
<option value="GR">GR</option>
<option value="GL">GL</option>
<option value="GD">GD</option>
<option value="GP">GP</option>
<option value="GU">GU</option>
<option value="GT">GT</option>
<option value="GG">GG</option>
<option value="GN">GN</option>
<option value="GW">GW</option>
<option value="GY">GY</option>
<option value="HT">HT</option>
<option value="HM">HM</option>
<option value="VA">VA</option>
<option value="HN">HN</option>
<option value="HK">HK</option>
<option value="HU">HU</option>
<option value="IS">IS</option>
<option value="IN">IN</option>
<option value="ID">ID</option>
<option value="IR">IR</option>
<option value="IQ">IQ</option>
<option value="IE">IE</option>
<option value="IM">IM</option>
<option value="IL">IL</option>
<option value="IT">IT</option>
<option value="JM">JM</option>
<option value="JP">JP</option>
<option value="JE">JE</option>
<option value="JO">JO</option>
<option value="KZ">KZ</option>
<option value="KE">KE</option>
<option value="KI">KI</option>
<option value="KP">KP</option>
<option value="KR">KR</option>
<option value="KW">KW</option>
<option value="KG">KG</option>
<option value="LA">LA</option>
<option value="LV">LV</option>
<option value="LB">LB</option>
<option value="LS">LS</option>
<option value="LR">LR</option>
<option value="LY">LY</option>
<option value="LI">LI</option>
<option value="LT">LT</option>
<option value="LU">LU</option>
<option value="MO">MO</option>
<option value="MK">MK</option>
<option value="MG">MG</option>
<option value="MW">MW</option>
<option value="MY">MY</option>
<option value="MV">MV</option>
<option value="ML">ML</option>
<option value="MT">MT</option>
<option value="MH">MH</option>
<option value="MQ">MQ</option>
<option value="MR">MR</option>
<option value="MU">MU</option>
<option value="YT">YT</option>
<option value="MX">MX</option>
<option value="FM">FM</option>
<option value="MD">MD</option>
<option value="MC">MC</option>
<option value="MN">MN</option>
<option value="ME">ME</option>
<option value="MS">MS</option>
<option value="MA">MA</option>
<option value="MZ">MZ</option>
<option value="MM">MM</option>
<option value="NA">NA</option>
<option value="NR">NR</option>
<option value="NP">NP</option>
<option value="NL">NL</option>
<option value="AN">AN</option>
<option value="NC">NC</option>
<option value="NZ">NZ</option>
<option value="NI">NI</option>
<option value="NE">NE</option>
<option value="NG">NG</option>
<option value="NU">NU</option>
<option value="NF">NF</option>
<option value="MP">MP</option>
<option value="NO">NO</option>
<option value="OM">OM</option>
<option value="PK">PK</option>
<option value="PW">PW</option>
<option value="PS">PS</option>
<option value="PA">PA</option>
<option value="PG">PG</option>
<option value="PY">PY</option>
<option value="PE">PE</option>
<option value="PH">PH</option>
<option value="PN">PN</option>
<option value="PL">PL</option>
<option value="PT">PT</option>
<option value="PR">PR</option>
<option value="QA">QA</option>
<option value="RE">RE</option>
<option value="RO">RO</option>
<option value="RU">RU</option>
<option value="RW">RW</option>
<option value="SH">SH</option>
<option value="KN">KN</option>
<option value="LC">LC</option>
<option value="PM">PM</option>
<option value="VC">VC</option>
<option value="WS">WS</option>
<option value="SM">SM</option>
<option value="ST">ST</option>
<option value="SA">SA</option>
<option value="SN">SN</option>
<option value="RS">RS</option>
<option value="SC">SC</option>
<option value="SL">SL</option>
<option value="SG">SG</option>
<option value="SK">SK</option>
<option value="SI">SI</option>
<option value="SB">SB</option>
<option value="SO">SO</option>
<option value="ZA">ZA</option>
<option value="GS">GS</option>
<option value="ES">ES</option>
<option value="LK">LK</option>
<option value="SD">SD</option>
<option value="SR">SR</option>
<option value="SJ">SJ</option>
<option value="SZ">SZ</option>
<option value="SE">SE</option>
<option value="CH">CH</option>
<option value="SY">SY</option>
<option value="TW">TW</option>
<option value="TJ">TJ</option>
<option value="TZ">TZ</option>
<option value="TH">TH</option>
<option value="TL">TL</option>
<option value="TG">TG</option>
<option value="TK">TK</option>
<option value="TO">TO</option>
<option value="TT">TT</option>
<option value="TN">TN</option>
<option value="TR">TR</option>
<option value="TM">TM</option>
<option value="TC">TC</option>
<option value="TV">TV</option>
<option value="UG">UG</option>
<option value="UA">UA</option>
<option value="AE">AE</option>
<option value="GB">GB</option>
<option value="US">US</option>
<option value="UM">UM</option>
<option value="UY">UY</option>
<option value="UZ">UZ</option>
<option value="VU">VU</option>
<option value="VE">VE</option>
<option value="VN">VN</option>
<option value="VG">VG</option>
<option value="VI">VI</option>
<option value="WF">WF</option>
<option value="EH">EH</option>
<option value="YE">YE</option>
<option value="ZM">ZM</option>
<option value="ZW">ZW</option>
</select>

Develop Reference

JavaScript is the programming language of the Web.

Get option value in form, then use it in a url - javascript

You need start php and end php tag for echo $_GET content value nation_id <img src='http://futhead.cursecdn.com/static/img/16/clubs/"<?php echo $_GET['nation_id'] ?>"' > if you setup php interpritator

Related

Why are the 2 <select> elements that are being appended to my form not looking the same as the first 2 fixed in my Form?

React: Generate all date of birth select options

How to Link to a Selected Drop-Down Item to Open a Web Page

How do I grab the option text from a value

GoogleMaps, visualize Country based on a CountryCode

Categories

Resources