www.webdeveloper.com
Results 1 to 2 of 2

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

  1. #1
    Join Date
    May 2012
    Posts
    2

    Question Get value of selected option in dynamic created select??

    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...

  2. #2
    Join Date
    May 2012
    Posts
    2
    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 Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles