thinkPHP三级城市联动
html+js:
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>城市联动示例</title>
</head>
<body>
<select name="province" id="province" onchange="loadRegion('province',2,'city','{:U('Index/getRegion')}');">
<option value="0" selected>省份/直辖市</option><volist name="province" id="vo">
<option value="{$vo.id}" >{$vo.name}</option></volist>
</select>
<select name="city" id="city" onchange="loadRegion('city',3,'town','{:U('Index/getRegion')}');">
<option value="0">市/县</option>
</select>
<select name="town" id="town">
<option value="0">镇/区</option>
</select>
</body>
<script type="text/javascript" src="__PUBLIC__/js/jquery-1.8.0.min.js"></script>
<script>
function loadRegion(sel,type_id,selName,url){
jQuery("#"+selName+" option").each(function(){
jQuery(this).remove();
});
jQuery("<option value=0>请选择</option>").appendTo(jQuery("#"+selName));
if(jQuery("#"+sel).val()==0){
return;
}
jQuery.getJSON(url,{pid:jQuery("#"+sel).val(),type:type_id},
function(data){
if(data){
jQuery.each(data,function(idx,item){
jQuery("<option value="+item.id+">"+item.name+"</option>").appendTo(jQuery("#"+selName));
});
}else{
jQuery("<option value='0'>请选择</option>").appendTo(jQuery("#"+selName));
}
}
);
}
</script>
</html>
php：
<?php
namespace Home\Controller;
use Think\Controller;
class IndexController extends Controller{
/**
* 用户信息查询
*/
public function index(){
$province = M('Tree')->where ( array('pid'=>1) )->select ();
$this->assign('province',$province);
$this->display();
}
public function getRegion(){
$Region=M("Tree");
$map['pid']=$_REQUEST["pid"];
$map['type']=$_REQUEST["type"];
$list=$Region->where($map)->select();
echo json_encode($list);
}
}
sql语句：
DROP TABLE IF EXISTS `gc_tree`;
CREATE TABLE `gc_tree` (
`id` int(5) unsigned NOT NULL AUTO_INCREMENT,
`pid` int(5) unsigned NOT NULL DEFAULT '0',
`name` varchar(120) DEFAULT NULL,
`type` tinyint(1) DEFAULT '2',
PRIMARY KEY (`id`)
) ENGINE=MyISAM AUTO_INCREMENT=1 DEFAULT CHARSET=utf8;
数据文件：链接: https://pan.baidu.com/s/1jHMAxCU 密码: 5y79
thinkPHP三级城市联动的更多相关文章
- 全国三级城市联动 js版
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- YII+DWZ三级城市联动挂件
挂件PHP文件 class CountryCityCombox extends RXWidget { public $provinceId = 2; public $cityId = 3687; pu ...
- JQUERY省、市、县城市联动选择
JQUERY 插件开发——CITYLINKAGE(省.市.县城市联动选择) 第一部分:背景 开发源于需求,本次城市联动选择插件算是我写插件的一个特例吧,不是我目前工作需要些的,算是兴趣驱使吧.之前 ...
- JS中简单的二级城市联动
代码奉上: <!DOCTYPE html><html><head> <meta charset="UTF-8"> < ...
- Jquery 插件开发——citylinkage（省、市、县城市联动选择）
第一部分:背景 开发源于需求,本次城市联动选择插件算是我写插件的一个特例吧,不是我目前工作需要些的,算是兴趣驱使吧.之前呢,一直想写这个插件,然后错过了一个写这个插件的机会(这个得回顾到很久以前了. ...
- 城市联动 - 自动生成SQL语句
字段比较简单/ 如果有需要可以自己定制字段和排序/ 一共二级城市联动, 本人业务需要, 所以就两层, 网上关于三层的挺多, 有需要可以借鉴/ 废话不多说, 先看效果图, 代码在下面 <?php ...
- JQuery+Ajax实战三级下拉列表联动（八）
本片文章为练习,项目中不会这样写: 一:涉及到的知识点: jQuery Dom操作 jQuery Ajax操作 ASP.net中的json操作 二:用了自动代码生成器 1.Dal层的代码: publi ...
- java基础68 JavaScript城市联动框（网页知识）
1.城市联动框 <!doctype html> <html> <head> <meta charset="utf-8"> <t ...
- 基于jQuery+ashx+.net实现三级栏目联动操作
父级ID可以为空以两个编号为一级 可以添加到第四级 table 字段有ID. name .parentNode. childNode等基本属性 selecet parentNode ,len(c ...
随机推荐
- 【leetcode】1207. Unique Number of Occurrences
题目如下: Given an array of integers arr, write a function that returns true if and only if the number o ...
- 9. ClustrixDB主从复制
一.在线添加从库 主集群: 10.1.1.23:5306 从集群: 10.1.3.88:5306 主库开启binlog MySQL [(none)]> CREATE BINLOG 'clustr ...
- C# for循环测试
- 基于STM32的CRC校验说明
///***************************************************************************** //下面是test.c里面的函数 // ...
- java+web+批量下载文件
JavaWeb 文件下载功能 文件下载的实质就是文件拷贝,将文件从服务器端拷贝到浏览器端,所以文件下载需要IO技术将服务器端的文件读取到,然后写到response缓冲区中,然后再下载到个人客户端. 1 ...
- MongoDB操作：insert()
@Override public boolean inSert(String dbName, String collectionName, String[] keys, Object[] values ...
- sublime安装完插件后出现的一些问题
1.安装anaconda后代码前面出现小方框 解决办法:这是由于不符合PEP8代码规范,在空白地方右击,选择anaconda --> autoformat PEP8 Errors ,同时保证导入 ...
- 【Leetcode】位1的个数
解题方案:位操作的技巧 整数 n 和 n-1(n>0) 做与运算,从其二进制形式来看,可以消掉 n 的二进制数值中最后1个 “1” .循环进行,每次消掉1个 “1” .整数 n 的二进制数值中有 ...
- RotateZoom.cpp 20180622
20180622代码加入随意变换图像大小 批处理框架先不看:-B src3.bmp 10 1 30 2 0.1 3 tar.bmp src2.bmp 37.5 2.1 tar // RotateZo ...
- Delphi XE2 之 FireMonkey 入门(43) - 控件基础: TStringGrid、TGrid
Delphi XE2 之 FireMonkey 入门(43) - 控件基础: TStringGrid.TGrid TStringGrid.TGrid 都是从 TCustomGrid 继承; 区别有:1 ...