Change iframe src onchange of dropdown value
I am able to change the source of an iframe very easily with a "button" click. But no matter what I try, I can't make the same happen with the use of a dropdown.
This works:
<html>
<body>
<a href="google.com" target="iframe">google</a>
<iframe name="iframe" src="yahoo.ca"></iframe>
</body>
</html>
But this does not:
<html>
<body>
<form name="change">
<select name="options" target="iframe">
<option><a href="google.com" target="iframe">google</a></option>
</select>
</form>
<iframe name="iframe" src="yahoo.ca"></iframe>
</body>
</html>
Any advice would be greatly appreciated. I found other posts similar, but all involved the use of arrays - which I don't believe I should need?
Answer
You need to use JavaScript
<html>
<body>
<form name="change">
<SELECT NAME="options" ONCHANGE="document.getElementById('youriframe').src = this.options[this.selectedIndex].value">
<option>choise</option>
<option value="http://microsoft.com">Microsoft</option>
</SELECT>
<iframe name="iframe" id="youriframe" src="yahoo.ca"></iframe>
</body>
</html>