關於在smarty中實現省市區三級聯動

時間 2019-12-11

標籤關於 smarty 實現省市區三級聯動简体版

原文原文鏈接

剛開始接觸php，，其實對於一些比較深刻的東西還不是很瞭解，就像是此次的省市區聯動，都是用三張表爲基礎編碼的，原諒個人無知，謝謝。javascript

接下來就是編碼部分了：php

<?php
require('./smarty/Smarty.class.php');
date_default_timezone_set("PRC");
$conn = mysql_connect("localhost","root","123456");
mysql_select_db("dbcity");
mysql_query("set names utf8");

$sql = " select pid,pname  from province";
$result = mysql_query($sql,$conn);
while ($rs = mysql_fetch_assoc($result)){  
    $list[] = array("pid" => $rs["pid"],"pname" => $rs["pname"]);
}


$sql2 = "select cid,cname from city where pid={$list[0]['pid']}";
$result2 = mysql_query($sql2,$conn);
while($rs2 = mysql_fetch_assoc($result2)){
    $list2[] = array("cname" => $rs2["cname"],"cid" =>$rs2["cid"]);
}
 

$sql3 = "select xname,xid from xian where cid={$list2[0]['cid']}";
$result3 = mysql_query($sql3,$conn);
while($rs3 = mysql_fetch_assoc($result3)){
    $list3[] = array("xname" => $rs3["xname"]);
}


$smarty = new Smarty();
$smarty->left_delimiter='<{';//左邊界符
$smarty->right_delimiter='}>';//右邊界符
$smarty ->assign("content",$list);
$smarty ->assign("name",$list2);
$smarty ->assign("xian",$list3);
$smarty ->display("show.html");

?>

以上是爲了從數據庫中把全部的先加載出來，主要就是用到smarty，數組。其餘的都沒有什麼能夠深究的了，能夠看到上面代碼的最後一句話就是爲了跳轉到smarty的模板頁面show.htmlhtml

接下來咱們來共同看一下模板頁面的書寫代碼：java

 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4 <meta charset="UTF-8">
 5 <title>省市級聯</title>
 6 <script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
 7 <script type="text/javascript">
 8 $(function(){
 9     $("#province").change(function() {   
10         var province = $("#province").val(); 
11         alert(province);
12         $.ajax({
13             url: 'display.php',
14             type: 'GET',
15             data: {'category':'city', city:province},
16             dataType:'json',
17             success: function(data){
18                 var content = '';
19                 for (var i in data) {    
20                     content += '<option value='+data[i].cid+'>'+data[i].cname+'</option>';
21                 }
22                 $('#city').html(content);
23             }
24         });  //  'abc."$age".def'
25     });
26     $("#city").change(function(){
27         var city = $("#city").val();
28         alert(city);
29         $.ajax({
30             url:'assign.php',
31             type:'GET',
32             data:{'category':'xian',xian:city},
33             dataType:'json',
34             success:function(data){
35                 var content = '';
36                 for(var i in data){
37                     content +='<option>'+data[i].xname+'</option>';
38                 }
39                 $('#xian').html(content);
40             }
41         })
42     })
43 })
44 </script>
45 </head>
46 <body>
47   選擇省份:<select name="province" id="province" style="width:100px;" onclick="click" >
48   <{foreach from=$content key=k item=value}> 
49        <option value="<{$value.pid}>"><{$value.pname}></option> 
50   <{/foreach}>
51   </select>  <br/>
52   選擇城市:<select name="city" id="city" style="width:100px;">
53    
54   <{foreach from=$name  item=value2}> 
55        <option value="<{$value2.cid}>"><{$value2.cname}></option>
56   <{/foreach}>    
57   </select><br/>
58     選擇縣城:<select name="xian" id="xian" style="width:100px;">
59    
60   <{foreach from=$xian  item=value3}> 
61        <option><{$value3.xname}></option>
62   <{/foreach}>    
63   </select><br/>
64 </body>
65 </html>

這裏的命名不是規範，但願不要誤導你們，，你們在本身編寫代碼的時候仍是要注意本身的編碼規範的。首先，咱們能夠看到「選擇省份」的select標籤，這裏咱們就是根據index.php頁面傳過來的數組利用foreach進行循環遍歷，遍歷出省份的id，省份名稱。在這裏，省份的id是必不可少的，由於它牽扯到接下來select的change事件，因此必定要注意這個地方。接下來就是異步提交的ajax事件了，咱們根據以前給select的id叫作province來作他的change事件，這裏ajax你們就要本身對ajax進行學習了，其實，在php裏面使用smarty模板引擎是爲了將後臺代碼與前臺展現代碼分離開來，可是這裏爲了你們可以看得仔細，因此將JavaScript代碼放在頁面裏了，最好是在項目裏面寫一個JavaScript腳本而後進行導入，有利於頁面的整潔，咱們先看省份的ajax代碼，咱們在它的url屬性裏面讓它進入到display.php頁面，mysql

so，接下來就是display頁面的代碼了jquery

 1 <?php
 2 date_default_timezone_set("PRC");
 3 $conn = mysql_connect("localhost","root","123456");
 4 mysql_select_db("dbcity");
 5 mysql_query("set names utf8");
 6 if($_GET['category']){          
 7    if($_GET["category"] != "") {
 8    //根據省份獲得城市
 9    $sql = "select cid,cname from city where pid=".$_GET['city'];
10    $result = mysql_query($sql,$conn);
11    if (mysql_num_rows($result) > 0) {
12    while ($row = mysql_fetch_assoc($result)) {
13         $str[] = array("cid"=>$row["cid"],"cname"=>($row["cname"]));
14    }
15    //var_dump($str);
16    echo (json_encode($str));
17    }
18    mysql_free_result($result);
19   }
20 }
21 
22 
23 ?>

在這裏，咱們使用GET方法獲取以前ajax傳過來的參數，獲取點擊省份時候的id，根據這個id來獲取這個省份下面的城市。固然了，以後的城市下面的區咱們就顯而易見了，可是特別要注意的是要把城市的select標籤的value值獲取獲取出來，以便查詢它所管轄的區。ajax

assign.php代碼以下sql

 1 <?php
 2 date_default_timezone_set("PRC");
 3 $conn = mysql_connect("localhost","root","123456");
 4 mysql_select_db("dbcity");
 5 mysql_query("set names utf8");
 6 if($_GET['category']){
 7     if($_GET["category"] != "") {
 8         //根據省份獲得城市
 9         $sql = "select xid,xname from xian where cid=".$_GET['xian'];
10         $result = mysql_query($sql,$conn);
11         if (mysql_num_rows($result) > 0) {
12             while ($row = mysql_fetch_assoc($result)) {
13                 $str[] = array("id"=>$row["xid"],"xname"=>($row["xname"]));
14             }
15             //var_dump($str);
16             echo (json_encode($str));
17         }
18         mysql_free_result($result);
19     }
20 }
21 ?>

但願個人提示可以對你有所幫助，謝謝！數據庫

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。