CODEWITHSUNDEEP
javascripthtmlattributes
Aaron Quitta
Aaron Quitta

Reputation: 161

Passing a JavaScript variable to a html <select> attribute

I am trying to pass a variable from JavaScript to value attribute of the select tag. Here is my code:

<script>

 if (window.location.href.substring(0, 9) === "http://ww") {
     var home_var = "bing.com";
     var home_var = "poem.com";
 } else if (window.location.href.substring(0, 9) === "https://p") {
     var home_var = "https://px.multiscreensite.com/index.php?url=bing.com";
     var poem_var = "https://px.multiscreensite.com/index.php?url=poem.com";
 } else {
     var home_var = "1";
     var_poem_var = "2";
 }
 console.log(home_var);

</script>

<select OnChange="window.location.href=this.value">
   <option>Tagged Stuff and Navigation</option>
   <option value=HOME_VAR>Home Page</option>
</select>

Upvotes: 0

Views: 2197

Answers (3)

earl3s
earl3s

Reputation: 2373

If you add the SELECT after in javascript you can achieve this:

<select id="mySelect" OnChange="window.location.href=this.value">
    <option>Tagged Stuff and Navigation</option>
</select>

<script>
    if (window.location.href.substring(0,9) === "http://ww") {
    var home_var = "bing.com";    
    }
    else if (window.location.href.substring(0,9) === "https://p") {
    var home_var = "https://px.multiscreensite.com/index.php?url=bing.com";
    }
    else {
    var home_var = "1";
    }
    var select= document.getElementById("mySelect");
    var option = document.createElement("option");
    option.text = "Hope Page";
    option.value = home_var;
    select.add(option);
    console.log(home_var);
</script>

JS Fiddle https://jsfiddle.net/emfvyhq2/

Upvotes: 1

Hector Barbossa
Hector Barbossa

Reputation: 5528

Are you looking for something like 

function changeLink(val) {
   if(val === 'HOME_VAR'){
     ... your code logic ...
   }
}

 <select onchange="javascript:changeLink(this.value)">
       <option>Tagged Stuff and Navigation</option>
       <option value="HOME_VAR">Home Page</option>
 </select>

Upvotes: 0

kirinthos
kirinthos

Reputation: 452

you could add the element dynamically...

<script>
(function() {
    var s = document.getElementById("selector");
    var o = document.createElement("option");
    o.innerHTML = "Home Page";
    o.value = home_var;
    s.appendChild(o);
})();
</script>

<select id="selector" OnChange="window.location.href=this.value">    
    <option>Tagged Stuff and Navigation</option> 
</select>

Upvotes: 1

Related Questions