Using Javascript to load an html page inside an iframe

Question

I am trying to get each option to load a different page in frame

<!DOCTYPE html>
<html>
<head>
<script>
function selectCountry()
{
var mylist=document.getElementById("country");
document.getElementById("frame").src=mylist.options[mylist.selectedIndex].html;
}
</script>
</head>
<form action="">
<select id = "country" onchange="selectCountry()">
<option value="america">America</option>
<option value="austria">Austria</option>
<option value="belgium">Belgium</option>
<option value="bosnia">Bosnia and Herzegovina</option>
<option value="croatia">Croatia</option>
<option value="estonia">Estonia</option>
<option value="france">France</option>
<option value="germany">Germany</option>
<option value="greece">Greece</option>
<option value="hungary">Hungary</option>
<option value="italy">Italy</option>
<option value="netherlands">Netherlands</option>
<option value="russia">Russia</option>
<option value="serbia">Serbia</option>
<option value="sweden">Sweden</option>
<option value="switzerland">Switzerland</option>
<option value="uk">UK</option>
</select>
</form>
<iframe id = "frame"></iframe>
</body>
</html>

but the page does not load in the iframe, apache gives an object not found message despite the page being in the same folder as index.html above. I have tried changing the line:

document.getElementById("frame").src=mylist.options[mylist.selectedIndex].html;

to:

document.getElementById("frame").src=mylist.options[mylist.selectedIndex] + ".html";

but no joy. plz help.

You want .value(), not .html()

Diodeus - James MacFarlane
– Diodeus - James MacFarlane

2013-08-23 17:56:42 +00:00
Commented Aug 23, 2013 at 17:56 — Diodeus - James MacFarlane
– Diodeus - James MacFarlane, Commented Aug 23, 2013 at 17:56

cocco · Accepted Answer · 2013-08-23 18:19:17Z

1

You can do it this way.

function selectCountry(){
 var mylist=document.getElementById("country");
 document.getElementById("frame").src=mylist.value+'.html';
}

or

mylist.options[mylist.selectedIndex].value

value is missing.

edited Aug 23, 2013 at 18:19

answered Aug 23, 2013 at 17:56

cocco

16.8k7 gold badges65 silver badges77 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Using Javascript to load an html page inside an iframe

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related