Get value of selected option in dynamic created select??

**Im2be** · 05-18-2012 07:55 AM

I want to get the value of the selected option in a SELECT field that is dynamically created. However, I keep getting the error:
'Unable to get value of the property options: object is null or undefined'
Code:

Code:

<!doctype html>
<html>
<head>
<script type="text/javascript">

var frmForm = document.createElement("form");
	var selHour = document.createElement("select");
		selHour.setAttribute('id','selHour');
		for(var i = 6; i <= 9; i++){
			var option = document.createElement('option');
				option.setAttribute('value','0'+i);
				option.appendChild(document.createTextNode('0' + i));
			selHour.appendChild(option);
		}
		for(var i = 10; i <= 22; i++){
			var option = document.createElement('option');
				option.setAttribute('value',i);
				option.appendChild(document.createTextNode(i));
			selHour.appendChild(option);
		}
	var lnkGetValue = document.createElement("a");
		lnkGetValue.setAttribute("onclick","getValue();");
		lnkGetValue.setAttribute("href","#");
		lnkGetValue.appendChild(document.createTextNode("Get the value"));
		
frmForm.appendChild(selHour);
frmForm.appendChild(lnkGetValue);
document.getElementById('cont').appendChild(frmForm);
</script>

<script type="text/javascript">
function getValue(){
	var starthour = document.getElementById("selHour");
	document.getElementById("container").appendChild(document.createTextNode(starthour.options[starthour.selectedIndex].value));
}
</script>
<title>example</title>
</head>
<body>
<div id="cont">
</div>
</body>
</html>

Also, there seems to be a problem at line 26:
'Unable to get value of the property appendChild: object is null or undefined'

Please help...

**Im2be** · 05-18-2012 08:02 AM

Also, there seems to be a problem at line 26:
'Unable to get value of the property appendChild: object is null or undefined'

Solved with this code:

Code:

<!doctype html>
<html>
<head>
<script type="text/javascript">
function getValue(){
	var starthour = document.getElementById("selHour");
	alert(starthour.options[starthour.selectedIndex].value);
}
</script>
<title>example</title>
</head>
<body>
<div id="cont">
</div>
<script type="text/javascript">
var frmForm = document.createElement("form");
	var selHour = document.createElement("select");
		selHour.setAttribute('id','selHour');
		for(var i = 6; i <= 9; i++){
			var option = document.createElement('option');
				option.setAttribute('value','0'+i);
				option.appendChild(document.createTextNode('0' + i));
			selHour.appendChild(option);
		}
		for(var i = 10; i <= 22; i++){
			var option = document.createElement('option');
				option.setAttribute('value',i);
				option.appendChild(document.createTextNode(i));
			selHour.appendChild(option);
		}
	var lnkGetValue = document.createElement("a");
		lnkGetValue.setAttribute("onclick","getValue();");
		lnkGetValue.setAttribute("href","#");
		lnkGetValue.appendChild(document.createTextNode("Get the value"));
		
frmForm.appendChild(selHour);
frmForm.appendChild(lnkGetValue);
document.getElementById('cont').appendChild(frmForm);
</script>
</body>
</html>

Still need help with my main question though :/

Thread: Get value of selected option in dynamic created select??

Thread Tools

Display

Get value of selected option in dynamic created select??

Thread Information

Users Browsing this Thread

Bookmarks

Bookmarks

Posting Permissions