PDA

View Full Version : Ajax không chạy được trên Firefox và Chrome



trungxp2004
24-12-2008, 10:06
Chào các huynh,

Mình mới học Ajax, vừa làm được một cái form trong đó có 2 cái dropdown list tạm gọi là Category và Subcategory. Khi người dùng chọn một Category nào đó từ dropdown list thứ nhất thì trong dropdown list thứ 2 sẽ chỉ liệt kê những subcategory của category đó. Các category và subcategory này được lấy từ 2 bảng trong database.
Mã nguồn của form như sau (đã cắt bớt những thứ không cần thiết):
<select name="category" size="1" onchange="loadSubcategories(this.value)">
<option value="" selected>--- Please select category ---</option>
<!-- BEGIN: cat_list -->
<option value="{cat_list.cat_name}">{cat_list.cat_name}</option>
<!-- END: cat_list -->
</select>
<div id="txtHint"><select name="subcat_name"><option value="">-Select subcategory from list-</option></select></div>

File chứa các hàm JS như sau:
var xmlHttp

function loadSubcategories(str)
{
xmlHttp=GetXmlHttpObject()
if(xmlHttp==null)
{
alert("Browser does not support Hppt request")
return
}
var url="load_subcat.php"
url=url+"?q="+str
url=url+"&sid="+Math.random()
xmlHttp.onreadystatechange=stateChanged
xmlHttp.open("GET",url,true)
xmlHttp.send(null)
}

function stateChanged()
{
if(xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
{
document.getElementById("txtHint").innerHTML=xmlHttp.responseText
}
}

function GetXmlHttpObject()
{
var xmlHttp=null;
try
{
//FireFox, Opera 8.0+, Safari
xmlHttp=new XMLHttpObject();

}
catch (e)
{
//Internet Explorer
try
{
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e)
{
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
}
return xmlHttp;
}

và đây là file load_subcat.php
<?php

$q = $_GET["q"];

include("library/dbconnect.php");

$cat_sql = "SELECT * FROM link_categories WHERE cat_name='".$q."'";

$cat_query = mysql_query($cat_sql);

$cat_result = mysql_fetch_array($cat_query);

$subcat_sql = "SELECT * FROM link_subcategories WHERE cat_id='".$cat_result[cat_id]."' ORDER BY subcat_name ASC";

$subcat_result = mysql_query($subcat_sql);

echo "<select name='subcat_name'>";

echo "<option value='' selected>-Select subcategory from list-</option>";

while($row = mysql_fetch_array($subcat_result)){

echo "<option value='".$row[subcat_name]."'>".$row[subcat_name]."</option>";
}

echo "</select>";

mysql_close($dbh);
?>

Vấn đề ở đây là ajax chạy tốt trên IE nhưng lại không chạy được trên Firefox và Chrome (các browser khác mình chưa thử nên không sure). Trên Firefox và Chrome, khi chọn category thì dropdown list thứ 2 vẫn không load được các subcategory.

Mong các huynh chỉ giúp các khắc phục lỗi này.