I have a piece of code function well on Google Chrome, Firefox but not working on IE version 8, the request.responseXML return empty on Internet Explorer.
my html form:
<?php
$content='<html>
<head>
<title>Client</title>
<script type="text/javascript" src="ajax.js"> </script>
<script type="text/javascript" src="existentClient.js"> </script>
</head>
<body >
<form id="existent-client">
Compagnie :
<select name="companyname" id="companyname" onchange="deleteOption();getCustomerInfo()">
<option selected="selected">
Select
</option>';
include './Connector/connect.php';
$sqlaffichcompany= mysql_query("SELECT DISTINCT companyname FROM company ORDER BY companyname ASC" ) or die(mysql_error());
while($fetchaffichcompany= mysql_fetch_array($sqlaffichcompany))
{
$content.='<option>';
$content.=$fetchaffichcompany['companyname'];
$content.='</option>';
}
mysql_close();
$content.='</select>
E-mail :
<select name="mail" id="mail" onchange="">
<option selected="selected">
Select
</option>
</select>
</form>
</body>
</html>';
echo $content;
?>
my ajax.js file:
var request = null;
try {
request = new XMLHttpRequest();
} catch (trymicrosoft) {
try {
request = new ActiveXObject("Msxml2.XMLHTTP");
} catch (othermicrosoft) {
try {
request = new ActiveXObject("Microsoft.XMLHTTP");
}
catch (failed) {
request = null;
}
}
}
if (request == null)
alert("Error creating request object!");
my javascript file existentClient.js:
function deleteOption()
{
//alert( "1" );
var listbox = document.getElementById( "mail" );
var lastIndex = listbox.options.length-1;
if ( lastIndex < 0 )
return;
listbox.remove( lastIndex );
//alert( "2" );
}
function getCustomerInfo() {
var client = document.getElementById("companyname").value;
var url = "lookupClient.php?client=" +
escape(client);
request.open("GET", url, true);
request.onreadystatechange = updateClient;
request.send(null);
}
function updateClient() {
if (request.readyState == 4) {
if (request.status == 200) {
deleteOption();
/* Get the response from the server */
var Doc = request.responseXML;
var x = Doc.getElementsByTagName("option");
for (i=0;i<x.length;i++)
{
/* Update the HTML web form */
var listbox = document.getElementById( "mail" );
var lastIndex = listbox.options.length-1;
var newOption = document.createElement( "option" );
newOption.innerHTML = x[i].firstChild.nodeValue;
newOption.value = x[i].firstChild.nodeValue;
try
{
listbox.options.add(newOption, lastIndex); // standards compliant; doesn't work in IE
}
catch (ex)
{
listbox.add( newOption, lastIndex); // IE only
alert( "In addOption(): " + ex );
}
}
} else
alert("Error! Request status is " + request.status);
}
}
my php file included the XML part:
<?php
$companyname=$_REQUEST['client'];
include './Connector/connect.php';
$sqlfindcompanyid=mysql_query("SELECT DISTINCT compid FROM company WHERE companyname='$companyname' " ) or die(mysql_error());
while ($fetchffindcompanyid=mysql_fetch_array($sqlfindcompanyid))
{
$companyid=$fetchffindcompanyid['compid'];
}
$sqlaffichclientid=mysql_query("SELECT DISTINCT mail FROM client WHERE compid='$companyid' ORDER BY mail ASC" ) or die(mysql_error());
header("Content-Type: application/xml");
?>
<?xml version="1.0" encoding="iso-8859-1"?>
<select>
<?php
while($fetchaffichclientid= mysql_fetch_array($sqlaffichclientid)) {
$mail = $fetchaffichclientid['mail'];
?><option><?php echo $mail; ?></option><?php
}
?>
</select>
<?php
mysql_close();
?>
any help please???
