function getXMLHTTP() problem in IE????

[StefanRSA]

I have 2 dropdown fields. One for Province and the other for towns.
I am using ajax to populate the towns field depending on the Province field selection.

This is all working fine in FF, Safari and even in Chrome... In IE8 NOTHING
happens??????

Please have a look and tell me what I am doing wrong????? (Or is this our friend IE8 that is acting up?????)

On my form header is the following:

<script language="javascript" type="text/javascript">
function getXMLHTTP() { //fuction to return the xml http object
var xmlhttp=false;
try{
xmlhttp=new XMLHttpRequest();
}
catch(e) {
try{
xmlhttp= new ActiveXObject("Microsoft.XMLHTTP");
}
catch(e){
try{
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
}
catch(e1){
xmlhttp=false;
}
}
}

return xmlhttp;
}



function getCity(strURL) {

var req = getXMLHTTP();

if (req) {

req.onreadystatechange = function() {
if (req.readyState == 4) {
// only if "OK"
if (req.status == 200) {
document.getElementById('citydiv').innerHTML=req.responseText;
} else {
alert("There was a problem while using XMLHTTP:\n" + req.statusText);
}
}
}
req.open("GET", strURL, true);
req.send(null);
}

}
</script>

My two fields on the form:

<!-- Province goes here -->
<tr>
<td>-</td><td>-</td><td>-</td><td><div class="tTip" title="What Province would you like this ad to apear?"><img src="../images/qt.gif" alt="" width="18" height="18"></div></td><td><font size="3" color="red">*</font>Province</td><td>
<select name="province" id="province" onChange="getCity('../member/townsrc.php?province='+this.value)">
<option value="0">Select Province</option>
<option value="1">KwaZulu-Natal</option>
<option value="2">Western Cape</option>
<option value="3">Eastern Cape</option>
<option value="4">Free State</option>
<option value="5">Gauteng</option>
<option value="6">Limpopo</option>
<option value="7">Mpumalanga</option>
<option value="8">North West</option>
<option value="9">Northern Cape</option>
</select>
</td>
</tr>
<!-- Province ends here -->
<!-- Town goes here -->
<tr>
<td>-</td><td>-</td><td>-</td><td><div class="tTip" title="Hey! You should even select the town!"><img src="../images/qt.gif" alt="" width="18" height="18"></div></td><td><font size="3" color="red">*</font>Town</td><td>
<div id="citydiv"><select name="city">
<option value="0">Select Town</option>
</select>
</div>

</td>
</tr>
<!-- Town ends here -->

And then my townsrc.php:

<?
include '../incl/config.php';
?>
<? $country=intval($_GET['province']);

$query=("SELECT * FROM search_town
JOIN search_region ON search_region.regionId=search_town.relRegionId
JOIN search_prov ON search_prov.provId=search_region.relProvId
WHERE search_prov.provId=$country
ORDER BY search_town.townLabel ASC");
$result=mysql_query($query);

?>
<select name="city">
<option value="0">Select Town</option>
<? while($row=mysql_fetch_array($result)) { ?>
<option value="<?echo $row['townLabel'];?>"><?=$row['townLabel']?></option>
<? } ?>
</select>

[StefanRSA]

Is there really nobody that can help me?:confused:

[JShor]

I blame IE8. I think the problem is in this section



function getXMLHTTP() { //fuction to return the xml http object
var xmlhttp=false;
try{
xmlhttp=new XMLHttpRequest();
}
catch(e) {
try{
xmlhttp= new ActiveXObject("Microsoft.XMLHTTP");
}
catch(e){
try{
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
}
catch(e1){
xmlhttp=false;
}
}
}

return xmlhttp;
}



I could be wrong.

[JShor]

Wow that was stupid, I didn't read the title.

It may actually be an html problem, and not an xmlhttp problem, the code looks right.

[StefanRSA]

Hey JShor,

Thanks for the reply....
I found the problem but dont know how to solve it...
I am using livevalidation for other fields on the form and when I exclude that js file from the header it works again in IE???

I am totaly dumbstruck and have NO IDEA how to get past this problem...
I will include the validate.js file as validate.zip... Can you or anybody PLEASE PLEASE help me in finding the conflict that is stopping my AJAX function to work in the Ajax field????