By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
446,369 Members | 1,188 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 446,369 IT Pros & Developers. It's quick & easy.

Error with calling getElementByID call from a dynamic list

P: 82
Hi,

I am creating dynamic list in the server through php and insert it using ajax.

for ajax I using the following statement:

document.getElementById(list_name_id).innerHTML=xm lHttp.responseText ;

until now everything is OK the list is builds correctly. but when I use the
document.getElementById(call_list_id).options.valu e I got an error saing "value is null or it is not an object" It seems that object list ID is null. Although when I was created the list I added a statement to the select "id=xxx".

Any suggestions how to solve this issue.

Here is my code:

Expand|Select|Wrap|Line Numbers
  1. <html>
  2.  
  3. <head>
  4.  
  5. <title></title>
  6. <script language="javascript" type="text/javascript">
  7.  
  8. var last_model_category_selected="none";
  9. var last_manufacture_selected="none";
  10. var last_model_type_selected="none";
  11. var last_model_name_selected="none";
  12. var url_base="http://192.168.2.6:8080/src/autocomplete/create_generic_listbox.php?";
  13.  
  14. function buildList(call_list_id,list_name_id)
  15. //call_list_id - The  div that calls the function
  16. //list_name_id - the id of the list to be created
  17. // 
  18. // Remember the value select in category list
  19.  
  20. var url;
  21.  
  22. if (call_list_id == "modelCategory" ) { 
  23.          last_model_category_selected=document.getElementById(call_list_id).options.value ;
  24.          url=url_base+"isEmpty=FALSE&list_type=manufacture&last_selected="+last_manufacture_selected+"&   list_dependency_1="+last_model_category_selected+"&list_dependency_2=''&list_dependency_3=''" ;
  25. //         alert(last_model_category_selected);
  26. } else if (call_list_id == "manufacture") {
  27. //alert(call_list_id);
  28.          last_manufacture_selected=document.getElementById(call_list_id).options.value ;
  29.  
  30.          url=url_base+"isEmpty=FALSE&list_type=model_type&last_selected="+last_model_type_selected+"&   list_dependency_1="+last_model_category_selected+"&list_dependency_2="+last_manufacture_selected+"&list_dependency_3=''" ;
  31. } else if (call_list_id == "modelType") {
  32.         last_model_type_selected=document.getElementById(call_list_id).options.value ;
  33.          url=url_base+"isEmpty=FALSE&list_type=model_type&last_selected="+last_model_type_selected+"&   list_dependency_1="+last_model_category_selected+"&list_dependency_2="+last_manufacture_selected+"&list_dependency_3="+last_model_type_selected ;
  34. } else {
  35.   return FALSE;
  36. }
  37.  
  38. // Perform Ajax request
  39.  
  40.        xmlHttp=GetXmlHttpObject(); 
  41.  
  42.         if (xmlHttp==null)
  43.          {
  44.            alert ("Your browser does not support AJAX!");
  45.            return FALSE;
  46.          }  
  47.  
  48.            xmlHttp.onreadystatechange = function() {
  49.            if (xmlHttp.readyState == 4 && xmlHttp.status==200) {        
  50.             document.getElementById(list_name_id).innerHTML=xmlHttp.responseText ;
  51.            }
  52.            };
  53.            xmlHttp.open("GET", url); 
  54.            xmlHttp.send(null);
  55.  
  56.  
  57.  
  58. }
  59.  
  60.  
  61. function GetXmlHttpObject()
  62. {
  63. var xmlHttp=null;
  64. try
  65.   {
  66.   // Firefox, Opera 8.0+, Safari
  67.   xmlHttp=new XMLHttpRequest();
  68.   }
  69. catch (e)
  70.   {
  71.   // Internet Explorer
  72.   try
  73.     {
  74.     xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
  75.     }
  76.   catch (e)
  77.     {
  78.     xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
  79.     }
  80.   }
  81. return xmlHttp;
  82.  
  83. }
  84.  
  85. </script>
  86.  
  87.  
  88. </head>
  89.  
  90. <body oninit=buildLists();>
  91. <form id="productSelector">
  92. <div id="modelCategoryDiv" > </div>
  93. <select name="modelCategory" id="modelCategory" style="width:130" onchange="buildList('modelCategory','manufacture')">
  94.   <option value="none" selected >none</option>
  95.   <option value="x"  >x</option>
  96.   <option value="y" >y</option>
  97.   <option value="z">z</option>
  98.   <option value="t">t</option>
  99. </select>
  100. <div id="manufacture"> </div>
  101. <div id="modelType"> </div>
  102. <div id="modelName"> </div>
  103.  
  104. </form>
  105. </body>
  106. </html>


Thanks
Ronen
Mar 9 '08 #1
Share this Question
Share on Google+
4 Replies


hsriat
Expert 100+
P: 1,654
options is an array.
If you have to use it, then you may need to use options[index].value.

If you want to know the current select value of the select box, use selectObject.value
Mar 9 '08 #2

P: 82
options is an array.
If you have to use it, then you may need to use options[index].value.

If you want to know the current select value of the select box, use selectObject.value
Thanks, I have the same issue the select id is null for some reason.You can try it yourself.
Mar 9 '08 #3

P: 82
I tried even:
Expand|Select|Wrap|Line Numbers
  1. last_manufacture_selected=document.getElementById('manufacture').options[document.getElementById('manufacture').options.selectedIndex].value;
  2.  
But still have the same error not an object or has null value.

It is look like that when you create the list on the server it display but you can not manipulate it.
Mar 9 '08 #4

hsriat
Expert 100+
P: 1,654
I tried even:
Expand|Select|Wrap|Line Numbers
  1. last_manufacture_selected=document.getElementById('manufacture').options[document.getElementById('manufacture').options.selectedIndex].value;
  2.  
But still have the same error not an object or has null value.

It is look like that when you create the list on the server it display but you can not manipulate it.
try this:
Expand|Select|Wrap|Line Numbers
  1. last_manufacture_selected = document.getElementById('manufacture').value;
Mar 10 '08 #5

Post your reply

Sign in to post your reply or Sign up for a free account.