PHP AJAX二级联动演示-城市地区

-- 
-- 表的结构 `citys`
-- 

CREATE TABLE `citys` (
  `id` int(11) NOT NULL auto_increment,
  `pid` int(11) NOT NULL default '0',
  `name` varchar(100) collate utf8_bin NOT NULL,
  `order` tinyint(4) NOT NULL default '0',
  PRIMARY KEY  (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_bin AUTO_INCREMENT=33 ;

-- 
-- 导出表中的数据 `citys`
-- 

INSERT INTO `citys` (`id`, `pid`, `name`, `order`) VALUES (1, 0, 'China', 0),
(2, 0, 'England', 0),
(3, 1, 'BEIJING', 0),
(4, 1, 'SHANGHAI', 0),
(5, 4, 'Baoshan', 0),
(6, 4, 'Changning', 1),
(7, 4, 'Hongkou', 0),
(8, 4, 'Huangpu', 0),
(17, 4, 'Zhabei', 0),
(18, 3, 'Changping', 0),
(19, 3, 'Chaoyang', 0),
(20, 3, 'Chongwen', 0),
(21, 3, 'Daxing', 1),
(22, 3, 'Dongcheng', 2),

<?php
/*
这里你首先加载你的数据库链接的代码，下面

Db::Get()->Conn()->getrows 的函数原型是：
function getrows($sqlstring,$Fetch_type=MYSQL_BOTH){
    $result=mysql_query($sqlstring);$results=NULL;
    if($result){
        while($row =mysql_fetch_array($result,$Fetch_type))
            $results[]    =    $row;
        mysql_free_result($result);
        return $results;
    }else{
        return false;
    }
}

*/
ob_clean();
//ob_start();
header("Content-Type:application/xml; charset=utf-8");
echo("<?xml version=\"1.0\" encoding=\"utf-8\"?>");
echo("<ClassLists>");
$pid=isset($_REQUEST['pid'])?intval($_REQUEST['pid']):1;
$sqled='select `id`,`name` from `citys` where `pid`='.$pid.' order by `order` asc';

$ArrayS=Db::Get()->Conn()->getrows($sqled,MYSQL_NUM);
if(is_array($ArrayS)){
    foreach($ArrayS as $key=>$v)
        echo("<List><id>".$v[0]."</id><name>".(htmlspecialchars($v[1]))."</name></List>");
}
echo("</ClassLists>");

?>

<?xml version="1.0" encoding="utf-8"?><ClassLists><List><id>3</id><name>BEIJING</name></List><List><id>4</id><name>SHANGHAI</name></List></ClassLists>

<select name="city" id="city" onchange="SortSelectChange(this.value,'district')"></select>
<script type="text/javascript">
<!--
//默认加载
SortSelectChange(1,'city');
//-->
</script>
</strong><span class="zi_6">District:<strong class="zi_6">
    <select name="district" id="district"></select>            
<script type="text/javascript">
<!--
//默认加载
SortSelectChange($('city').value,'district');
//-->
</script>

var $=function($){return getElementById_s($);}
function getElementById_s(id){
    var obj = null;
    if(document.getElementById){
        obj = document.getElementById(id);
    }else if(document.all){
        obj = document.all[id];
    }
    return obj;
}

function SortSelectChange(svalue,str){
    var xmlhttp = GetXmlHttp();
    if(xmlhttp==null) return;
    xmlhttp.open("GET","citys.php?pid="+escape(svalue),true);
    ///xmlhttp.setRequestHeader("CONTENT-TYPE","application/x-www-form-urlencoded");
    xmlhttp.onreadystatechange=function(){
        if(xmlhttp.readyState==4){
        var DataXml=xmlhttp.responseXML;//responseBody
        var liArray = DataXml.getElementsByTagName('List');
        $(str).length = 0;
            for(var i=0;i<liArray.length;i++){
                $(str).options.add(new Option(liArray[i].getElementsByTagName("name")[0].firstChild.data,liArray[i].getElementsByTagName("id")[0].firstChild.data));
            }
        //AddDefault($(str));
        }
    }
    xmlhttp.send (null);
}
 function GetXmlHttp(){
    var A=null; 
    try { 
        A=new ActiveXObject("Msxml2.XMLHTTP"); 
    }catch(e){ 
        try{ 
            A=new ActiveXObject("Microsoft.XMLHTTP"); 
        }catch(oc){ 
            A=null;
        }
    } 
    if ( !A && typeof XMLHttpRequest != "undefined" ){ 
        A=new XMLHttpRequest() ;
    } 
    return A ;
}