Error with calling getElementByID call from a dynamic list

Collapse
X
Collapse
 
  • Page of 1
  • Time
  • Show
Clear All
new posts
Previous template Next
  • raknin
    New Member
    • Oct 2007
    • 82
    #1

    Error with calling getElementByID call from a dynamic list

    Hi,

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

    for ajax I using the following statement:

    document.getEle mentById(list_n ame_id).innerHT ML=xmlHttp.resp onseText ;

    until now everything is OK the list is builds correctly. but when I use the
    document.getEle mentById(call_l ist_id).options .value 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:

    Code:
    <html>

<head>

<title></title>
<script language="javascript" type="text/javascript">

var last_model_category_selected="none";
var last_manufacture_selected="none";
var last_model_type_selected="none";
var last_model_name_selected="none";
var url_base="http://192.168.2.6:8080/src/autocomplete/create_generic_listbox.php?";

function buildList(call_list_id,list_name_id)
{ 
//call_list_id - The  div that calls the function
//list_name_id - the id of the list to be created
// 
// Remember the value select in category list

var url;

if (call_list_id == "modelCategory" ) { 
         last_model_category_selected=document.getElementById(call_list_id).options.value ;
         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=''" ;
//         alert(last_model_category_selected);
} else if (call_list_id == "manufacture") {
//alert(call_list_id);
         last_manufacture_selected=document.getElementById(call_list_id).options.value ;
         
         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=''" ;
} else if (call_list_id == "modelType") {
        last_model_type_selected=document.getElementById(call_list_id).options.value ;
         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 ;
} else {
  return FALSE;
}

// Perform Ajax request
     
       xmlHttp=GetXmlHttpObject(); 

        if (xmlHttp==null)
         {
           alert ("Your browser does not support AJAX!");
           return FALSE;
         }  
                       
           xmlHttp.onreadystatechange = function() {
           if (xmlHttp.readyState == 4 && xmlHttp.status==200) {        
            document.getElementById(list_name_id).innerHTML=xmlHttp.responseText ;
           }
           };
           xmlHttp.open("GET", url); 
           xmlHttp.send(null);
                   
         

}


function GetXmlHttpObject()
{
var xmlHttp=null;
try
  {
  // Firefox, Opera 8.0+, Safari
  xmlHttp=new XMLHttpRequest();
  }
catch (e)
  {
  // Internet Explorer
  try
    {
    xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
    }
  catch (e)
    {
    xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
  }
return xmlHttp;

}

</script>


</head>

<body oninit=buildLists();>
<form id="productSelector">
<div id="modelCategoryDiv" > </div>
<select name="modelCategory" id="modelCategory" style="width:130" onchange="buildList('modelCategory','manufacture')">
  <option value="none" selected >none</option>
  <option value="x"  >x</option>
  <option value="y" >y</option>
  <option value="z">z</option>
  <option value="t">t</option>
</select>
<div id="manufacture"> </div>
<div id="modelType"> </div>
<div id="modelName"> </div>

</form>
</body>
</html>


    Thanks
    Ronen
    Tags: None
    • hsriat
      Recognized Expert Top Contributor
      • Jan 2008
      • 1653
      #2
      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.va lue

        Comment

        • raknin
          New Member
          • Oct 2007
          • 82
          #3
          Originally posted by hsriat
          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.va lue
          Thanks, I have the same issue the select id is null for some reason.You can try it yourself.

            Comment

            • raknin
              New Member
              • Oct 2007
              • 82
              #4
              I tried even:
              Code:
              last_manufacture_selected=document.getElementById('manufacture').options[document.getElementById('manufacture').options.selectedIndex].value;
              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.

                Comment

                • hsriat
                  Recognized Expert Top Contributor
                  • Jan 2008
                  • 1653
                  #5
                  Originally posted by raknin
                  I tried even:
                  Code:
                  last_manufacture_selected=document.getElementById('manufacture').options[document.getElementById('manufacture').options.selectedIndex].value;
                  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:[CODE=javascript]last_manufactur e_selected = document.getEle mentById('manuf acture').value;[/CODE]

                    Comment

                    Previous template Next
                    Working...