Forgive me if this is a stupid question; it's been many years since I've worked with javascript. This is actually javascript and html rendered via PHP in Joomla, but I've tried using the same code in a plain old local HTML file and I'm getting the same error. I have a select field with several options, and onchange I want to set the value of a text field to the value of the selected option. No matter which option I choose, the text field is being set to "undefined". Can anyone help me out? Here's the plain html code:
<html>
<head>
<script type="text/javascript">
function setPrefix(){
var f = document.adminForm;
f.prefix.value = f.editprefixes.selectedIndex.value;
}
</script>
</head>
<body>
<form name="adminForm">
<select name="editprefixes" onchange="javascript:setPrefix()">
<option value=1000>1000</option>
<option value=1001>1001</option>
<option value=1005>1005</option>
<option value=1011>1011</option>
<option value=1016>1016</option>
</select>
<br />
<input type="text" name="prefix" value="" />
</form>
</body>
</html>
Forgive me if this is a stupid question; it's been many years since I've worked with javascript. This is actually javascript and html rendered via PHP in Joomla, but I've tried using the same code in a plain old local HTML file and I'm getting the same error. I have a select field with several options, and onchange I want to set the value of a text field to the value of the selected option. No matter which option I choose, the text field is being set to "undefined". Can anyone help me out? Here's the plain html code:
<html>
<head>
<script type="text/javascript">
function setPrefix(){
var f = document.adminForm;
f.prefix.value = f.editprefixes.selectedIndex.value;
}
</script>
</head>
<body>
<form name="adminForm">
<select name="editprefixes" onchange="javascript:setPrefix()">
<option value=1000>1000</option>
<option value=1001>1001</option>
<option value=1005>1005</option>
<option value=1011>1011</option>
<option value=1016>1016</option>
</select>
<br />
<input type="text" name="prefix" value="" />
</form>
</body>
</html>
-
1
Also there isn't really a reason to prefix javascript code in an attribute with the
javascript:pseudo-protocol.onchange="setPrefix()"will work properly. – Daniel Vandersluis Commented Aug 25, 2010 at 16:38
2 Answers
Reset to default 6A <select>'s selectedIndex property does not refer to an actual <option> object, but rather is an integer corresponding to the index of the option that is selected (so the first option is 0, second is 1, and so on).
If you want to get the value of the selected option, you need to use:
var sel = f.editprefixes;
f.prefix.value = sel.options[sel.selectedIndex].value;
Try this:
f.prefix.value = f.editprefixes.options[f.editprefixes.selectedIndex].value;