populating a drop down with Ajax? IE problems.

[bdbeames]

I have a page with google maps up and running. When a user clicks on a location from the map I would like to populate a drop down with data from the database related to that location. I have it up and working wonderful. Well that was what I thought until I tried it is IE. All that I get is an empty drop down. I know the problem is related to filling the element with the xmlHttp.responseText, but no matter how many solution I have tried as suggested by google I still have no luck.

main php page
[php]
<div style="width:330px; height:600px; float:left;">
<div>
<form id="pestForm" action="fruit.php?option=report" method="post">
<fieldset style="width:280px;">
<legend>Pest</legend>
<div id="error"><?php echo $_SESSION[error]; ?></div>
<p>
<label for="pest">Pest</label>
<select style="width:170px;" id="pest" name="pest" >
<option value="">Select Pest</option>
</select>
</p>
<p>
<label for="biodate">Biofix Date</label>
<input type="text" id="biodate" name="biodate" value="<? echo '01/01/' . date('Y'); ?>" size="10" maxlength="10" />
<input type="button" style="border-width: 0px; height: 17px; width: 19px; background-image: url('/img/calendar1.gif');
</p>
<p>
<label for="enddate">End Date</label>
<input type="text" id="enddate" name="enddate" value="<? echo date("m/d/Y"); ?>" size="10" maxlength="10" />
<input type="button" style="border-width: 0px; height: 17px; width: 19px; background-image: url('/img/calendar1.gif');
</p>
<div class="buttonbox">
<input type="submit" name="pSubmit" value="Submit" onclick="if (pestCheck() == false) return false;" />
<input type="reset" />
<input type="button" onclick="location.href='index.php'" value="Back" />
</div>
</fieldset>
</form>
</div>
</div>
[/php]


javascript used when a location is clicked

// This function is called each time a station marker is added
// it formats the station's tooltip and adds event listeners for click, hover, etc.
function formatMarker(station) {
   var num = station.stn_num;
   var name = station.stn_name;
   var div_width = (7.9 * name.length) + 48;
   if(div_width < 110) div_width = 110;
   station.tooltip = "<div id=\"tooltip\" style=\"width:" + div_width + "px\">Num:"+num+'<br/>Name: ' + name + '</div>';
 
   // Add listener for marker click events
   // if a station icon is clicked, its corresponding id is displayed
   GEvent.addListener(station, "click", function() {
         setPest();
   });
 
   // Add listener for marker hover events
   // if the user hovers over a station icon, information about the station is displayed
   GEvent.addListener(station,"mouseover", function() {
         showTooltip(station);
   });
   GEvent.addListener(station,"mouseout", function() {
         globaltooltip.style.visibility="hidden";
   });
   return station;
}
 
function setPest() {
   var xmlHttp = false;
   try {
      xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
   } catch (e) {
      try {
         xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
      } catch (e) {
         xmlHttp = false;
      }
   }
 
   if (!xmlHttp && typeof XMLHttpRequest!='undefined') {
      try {
         xmlHttp = new XMLHttpRequest();
      } catch (e) {
         xmlHttp = false;
      }
   }
 
   if (!xmlHttp && windos.createRequest) {
      try {
         xmlHttp = window.createRequest();
      } catch (e) {
         xmlHttp = false;
      }
   }
 
   //xmlHttp.overrideMimeType('text/xml');
 
   var url = "includes/ajax.php";
 
   xmlHttp.onreadystatechange=function() {
      if(xmlHttp.readyState==4) {
         //alert(xmlHttp.resonseText);
            var spanElement = document.getElementById('pest');
            spanElement.innerHTML = '';
            try {
               spanElement.innerHTML = xmlHttp.responseText;
            } catch (e) {
               var wrappingElement = document.createElement('div');
               wrappingElement.innerHTML = xmlHttp.responseText;
               spanElement.appendChild(wrappingElement);
            }
      }
   }
 
   xmlHttp.open("POST",url,true);
   xmlHttp.send(null);
}
 

php code that queries the database includes/ajax.php
[php]
<?php
$query = "SELECT pest_id, name FROM pests;";
$result = pg_query($query);

header("Content-type: text/xml");
$pest .= "<option value=''>Select Pest</option>\n";
while($info = pg_fetch_row($result)) {
$name = htmlentities(trim($info[1]));
$pest .= "<option value='$info[0]' >$name</option>\n";
}

echo $pest;
exit;
?>

[/php]

You help is welcome.

Here is the link if you want to try to see my problem. The error is only seen in IE
http://beta.climate.usurf.usu.edu/fruit.php

[acoder]

The link isn't working, so can you show how you call formatMarker()?