Hi, I have a javascript which updates price and unit from mysql database.
The option onchange event calls 2 javascript functions each one for price and unit.
The code works fine in IE, but does not work correctly in firefox.
Below is the code, can anyone suggest!
<html>
<head>
<script type="text/javascript">
function showUnit(str)
{
if (str=="")
{
document.getElementById("txtUnit").innerHTML="";
return;
}
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("txtUnit").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","getunit.php?q="+str,true);
xmlhttp.send();
}
function showPrice(str)
{
if (str=="")
{
document.getElementById("txtUnit").innerHTML="";
return;
}
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("txtPrice").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","getprice.php?q="+str,true);
xmlhttp.send();
}
</script>
</head>
<body>
<form>
<?php
//including the database connection file
include_once("config.php");
$query="SELECT * FROM products Order by product_id";
$result = mysql_query ($query);
echo "Select Product";
echo "<br>";
echo "<select name=product_id value='' onchange='showUnit(this.value); showPrice(this.value);'>";
// printing the list box select command
while($nt=mysql_fetch_array($result)){//Array or records stored in $nt
echo "<option value=$nt[product_id]>$nt[product_name]</option>";
/* Option values are added by looping through the array */
}
echo "</select>";
?>
</form>
<br />
<br>
<b>Person info will be listed here.</b>
<table border="1" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="100%" id="AutoNumber1">
<tr>
<td width="33%"><div id="txtPrice"></div>
</td>
<td width="33%"> </td>
<td width="34%"><div id="txtUnit"></div>
</td>
</tr>
</table>
</body>
</html>