Php+ajax+js Province Urban three-level linkage _php Tutorial

The basic idea is: in the JS dynamic creation of the Select control's option, through Ajax to obtain in PHP from the SQL database from the provincial and municipal information, the code is a bit long, but many are similar, such as JS in the province, city, district access method similar, Different SELECT statements are executed in PHP with different parameters.

Index.html Code:

"Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >


Php+ajax Getting SQL database

Thumbnails.js Code: Window.onload = getprovince; function Createrequest () {//ajax in PHP interaction requires object try {request = new XMLHttpRequest ();//Create a new request object;} catch (tryms) {try {requ EST = new ActiveXObject ("Msxml2.xmlhttp"); } catch (Otherms) {try {request = new ActiveXObject ("Microsoft.XMLHTTP");} catch (failed) {request = null;}}} return request;} function Sech (ID) {//] triggered when the city changes, select's OnChange event var AA = document.getElementById (ID), if (id== "Sheng") {getcity (aa.value );//Here Aa.value for the province of Id}if (id== "Shi") {getcounty (aa.value);//here Aa.value for City ID}} function getprovince () {//get all governorate request = Createrequest (); if (request = = NULL) {alert ("Unable to create request"), return, var url= "Getdetails.php?id=0",//id=0 when passed to PHP for all provinces R Equest.open ("GET", url, True); Request.onreadystatechange = displayprovince; Set the callback function request.send (NULL); Send request} function getcity (ID) {//Get province corresponding to City request = Createrequest (); if (request = = NULL) {alert ("Unable to create request") ; Return } var url= "getdetails.php?id=" + Escape (ID); Request.open ("GET ", url, True); Request.onreadystatechange = displaycity; Request.send (null);} function Getcounty (ID) {//Fetch city corresponds to the zone request = Createrequest (); if (request = = NULL) {alert ("Unable to create request"); Retu Rn } var url= "getdetails.php?id=" + Escape (ID); Request.open ("GET", url, True); Request.onreadystatechange = Displaycounty; Request.send (null);} function Displayprovince () {//Adds the obtained data dynamically to the Select if (request.readystate = = 4) {if (Request.status = =) {var a=new Arra Y;var b=request.responsetext;//assigns the data returned by PHP to B a=b.split (",");//Through "," Save this data in array a document.getElementById ("Sheng"). length=1; var Obj=document.getelementbyid ("Sheng"); For (I=0;i Obj.options.add (a[i],i+1);//Dynamically generated option is added to select, the first argument is text, and the second parameter is the value.}}} function displaycity () {//Adds the obtained data dynamically to the Select if (request.readystate = = 4) {if (Request.status = =) {var a=new array;va R B=request.responsetext; A=b.split (","); document.getElementById ("Shi"). length=1;//re-Selects document.getElementById ("Xian"). length=1;//re-Select if (dOcument.getelementbyid ("Sheng"). value!= "province") {var Obj=document.getelementbyid (' Shi '); for (i=0;i Obj.options.add (New Option (A[i], document.getElementById ("Sheng"). value*100+i+1)); Ocument.getelementbyid ("Sheng"). value*100+i+1 corresponds to the city's ID. }}}} function Displaycounty () {//Adds the obtained data to the Select if (request.readystate = = 4) {if (Request.status = =) {var a=new a Rray;var B=request.responsetext; A=b.split (","); document.getElementById ("Xian"). Length=1;if (document.getElementById ("Sheng"). value!= "Province" && document.getElementById ("Shi"). value!= "City") {var Obj=document.getelementbyid (' Xian '), for (I=0;i Obj.options.add ( New Option (a[i],i+1001)); } } }}getdetails.php Code: Header ("content-type:text/html; charset=gb2312 ");$conn = new COM ("ADODB. Connection ") or Die (" Cannot start ADO ");$connstr = "PROVIDER=SQLOLEDB; Persist Security Info=false; User Id=sa; Password=zzh;initial catalog=notebook;data Source=localhost "; if ($_request[' ID ']==0) {//Get list of provinces$conn->open ($CONNSTR); Establishing a database connection$SQLSTR = "Select name from province"; Set query string$rs = $conn->execute ($SQLSTR); Execute query to get results$num _cols = $rs->fields->count (); Get the number of data set columns$Province =array ();$i = 0;while (! $rs->eof) {$Province [$i]= $rs->fields[' name ']->value. ",";$rs->movenext ();$i + +;}foreach ($Province as $val)Echo $val;$conn->close ();$rs = null;$conn = null;} if ($_request[' id ']>0&&$_request[' id ']<35) {//Get a list of municipalities corresponding to the province$conn->open ($CONNSTR); Establishing a database connection$SQLSTR = "Select name from city where cid=". $_request[' ID ']; Set query string$rs = $conn->execute ($SQLSTR); Execute query to get results$num _cols = $rs->fields->count (); Get the number of data set columns$City =array ();$i = 0;while (! $rs->eof) {$City [$i]= $rs->fields[' name ']->value. ",";$rs->movenext ();$i + +;}foreach ($City as $val)Echo $val;$conn->close ();$rs = null;$conn = null;} if ($_request[' ID ']>100) {//Get a list of counties corresponding to provinces and cities$conn->open ($CONNSTR); Establishing a database connection$SQLSTR = "Select name from county where cid=". $_request[' ID ']; Set query string$rs = $conn->execute ($SQLSTR); Execute query to get results$num _cols = $rs->fields->count (); Get the number of data set columns$County =array ();$i = 0;while (! $rs->eof) {$County [$i]= $rs->fields[' name ']->value. ",";$rs->movenext ();$i + +;}foreach ($County as $val)Echo $val;$conn->close ();$rs = null;$conn = null;}?> Database design, Table province table, City table, County table.Requirements: Province table requires ID and NAME,ID recommendations from 1 to 34, such as Beijing ID 1, Guangdong ID 2, and so on; the city table needs id,name and cid,id for Cid*100+1,cid as the superior of the municipality, such as Shenzhen's superior to Guangdong province, CID is 2, Shenzhen ID is 201, and so on. County table needs id,name and CID, because it is a three-level relationship, the ID can be arbitrary, it is recommended to start from 10001 self-increment. CID is the superior, for example, the CID in Bao ' An district is 201, and the CID of Longgang District is 201;：HTML effect: Finished effect: note: PHP is server-side, it is recommended to publish the site through the IP debugging.Http://www.bkjia.com/PHPjc/775949.htmlWww.bkjia.comTrueHttp://www.bkjia.com/PHPjc/775949.htmlTecharticleThe basic idea is: in the JS dynamic creation of the Select control's option, through Ajax to obtain in PHP from SQL database information from the provinces and cities, the code is a bit long, but many are similar, such as JS in the province ...