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 ...
随机推荐
- CSS设置背景色
最好用background-color:rgba(37,77,113,1); 因为用opacity会让所有自标签都改变
- linux 系统下 tar 的压缩与解压缩命令
1.压缩 [small@sun shine]# tar -zcvf java.tar.gz java java/ java/default/ java/default/THIRDPARTYLICENS ...
- html caption标签 语法
html caption标签 语法 caption是什么标签? 作用:定义表格标题. 说明:caption 标签必须紧随 table 标签之后.您只能对每个表格定义一个标题.通常这个标题会被居中于表格 ...
- html canvas标签 语法
html canvas标签 语法 canvas是什么意思? 作用:定义图形,比如图表和其他图像. 说明:<canvas> 标签只是图形容器,通过脚本 (通常是JavaScript)来完成, ...
- TTTTTTTTTTTTTT CDOJ Sliding Window 线段树(nlogn)或双端队列(n) 模板
题目链接: L - Sliding Window Time Limit:6000MS Memory Limit:131072KB 64bit IO Format:%lld & ...
- [THUSC2017]大魔法师:线段树
分析 在线段树上用\(4 \times 4\)的矩阵打标记. 代码 #include <bits/stdc++.h> #define rin(i,a,b) for(register int ...
- Oracle报Ora01522
应用服务报错截图 数据库后台日志报错截图 从日志分析应该是回滚异常造成表空间无法使用回滚段,而回滚涉及的表空间为undo表空间 尝试新建UNDO表空间,再将UNDO_TABLESPACE切换到新建的U ...
- vue key的作用
key的作用是什么? 简单来说: key是给每一个vnode的唯一id,可以依靠key,更准确, 更快的拿到oldVnode中对应的vnode节点. 1. 更准确 因为带key就不是就地复用了,在sa ...
- bootstrap editable初始化后表单可修改数据
function loadData() { var url = "${ctx }/sys/marketing/product/page"; $('#tablepager').boo ...
- JPA使用中遇到Caused by: org.hibernate.hql.internal.ast.QuerySyntaxException: XXX is not mapped
在写自定义查询时,Query注解中写的JPQL,表名和列名都应该是映射的Java类和属性,不能写表名或者字段名