1、本篇教程以ajax+php动态展示【省、市、县、镇】四级地区单位

2、效果图:   

3、不废话,贴代码!

HTML:

          <div class="form-group">
<label class="col-sm-3 control-label" for="onecity">
地区分类
<span class="text-danger">*</span>
</label>
<div class="col-sm-2">
<select class="form-control" id="onecity" name="onecity" onchange="city()">
<option value="">请选择一级地区</option>
{loop $one $v}
<option value="{$v['id']}">{$v['name']}</option>
{/loop}
</select>
</div>
<!-- 二级城市 -->
<div class="col-sm-2" id="ss">
</div>
<!-- 三级城市 -->
<div class="col-sm-2" id="ss2">
</div>
<div class="col-sm-2" id="ss3">
</div>
<script text="text/javascript">
function city(){
var one=$("#onecity").val();
$.ajax({
type: "POST",
url: "/index.php?do=pubh***_third&id=19&step=step1_third&fc=1&one="+one,
success: function(msg){
$("#ss").empty();
$("#ss").append(msg);
}
});
}
</script>
<script text="text/javascript">
function city2(){
var two=$("#twocity").val();
$.ajax({
type: "POST",
url: "/index.php?do=pubh***_third&id=19&step=step1_third&fc=2&two="+two,
success: function(msg){
$("#ss2").empty();
$("#ss2").append(msg);
}
});
}
</script>
<script text="text/javascript">
function city3(){
var three=$("#threecity").val();
$.ajax({
type: "POST",
dataType: 'json',
url: "/index.php?do=pubh***_third&id=19&step=step1_third&fc=3&three="+three,
success: function(res){
$("#ss3").empty();
if(res.data!='error'){
$("#ss3").append(res.data);
}
}
});
}
</script>
</div>

php:

        //1、首先将省级单位给输出到页面 -- 1225
$one=db_factory::get_table_data("*",'w***_district','upid=0'); //2、ajax动态判断传过来的pid(省),获取市级单位,并动态输出<select><option>数据html
if($_R[fc]==1){
if($_R['one']){
$msg=db_factory::get_table_data("*","w***_district","upid=".$_R['one']);
}
$dis='<select class="form-control" name="twocity" id="twocity" onchange="city2();choose_village();"><option value="">请选择二级地区</option>';
foreach($msg as $v){
$dis.='<option value="'.$v[id].'">'.$v[name].'</option>';
}
$dis.='</select>';
echo $dis;
die;
}
if($_R[fc]==2){
if($_R['two']){
$msg=db_factory::get_table_data("*","w***_district","upid=".$_R['two']);
}
$dis='<select class="form-control" name="threecity" id="threecity" onchange="city3();"><option value="">请选择三级地区</option>';
foreach($msg as $v){
$dis.='<option value="'.$v[id].'">'.$v[name].'</option>';
}
$dis.='</select>';
echo $dis;
die;
}
if($_R[fc]==3){
if($_R['three']){
$msg=db_factory::get_table_data("*","wi***_district","upid=".$_R['three']);
}
/* 四级单位有可能没有的,比如直辖市、自治州 */
if($msg){
$dis='<select class="form-control" name="fourcity" id="fourcity" ><option value="">请选择四级地区</option>';
foreach($msg as $v){
$dis.='<option value="'.$v[id].'">'.$v[name].'</option>';
}
$dis.='</select>';
kekezu::echojson("",1,$dis);
//echo $dis;
die;
}
else{
kekezu::echojson("",2,'error');//参数依次msg、status、data
die ();
}
}

到这里就结束了,很简答的一个ajax应用。

【ajax+php】动态展示4级单位(省、市、县、镇)的更多相关文章

  1. 微信小程序结合后台数据管理实现商品数据的动态展示、维护

    微信小程序给我们提供了一个很好的开发平台,可以用于展现各种数据和实现丰富的功能,本篇随笔介绍微信小程序结合后台数据管理实现商品数据的动态展示.维护,介绍如何实现商品数据在后台管理系统中的维护管理,并通 ...

  2. echarts 地图 动态 展示 结合css+js

    echarts地图展示功能非常强大,官网上静态展示的样例非常多了,动态的资料少.研究了下.我眼下实现的通过ajax从server获取数据动态展示地图. 另外,我们有时候希望在地图之上做些自己定义的东西 ...

  3. 利用 Flask 动态展示 Pyecharts 图表数据的几种方法

    本文将介绍如何在 web 框架 Flask 中使用可视化工具 pyecharts, 看完本教程你将掌握几种动态展示可视化数据的方法,不会的话你来找我呀- Flask 模板渲染 1. 新建一个项目fla ...

  4. 面向 Java 开发人员的 Ajax: 构建动态的 Java 应用程序

    面向 Java 开发人员的 Ajax: 构建动态的 Java 应用程序 Ajax 为更好的 Web 应用程序铺平了道路 在 Web 应用程序开发中,页面重载循环是最大的一个使用障碍,对于 Java™ ...

  5. PHP+Jquery+Ajax 实现动态生成GUID、加载GUID

    GUID: 全局唯一标识符(GUID,Globally Unique Identifier)是一种由算法生成的二进制长度为128位的数字标识符.GUID主要用于在拥有多个节点.多台计算机的网络或系统中 ...

  6. 在Winform系统界面中对进展阶段的动态展示和处理

    在我们做客户关系管理系统的Winform界面的时候,需要对进展阶段这个属性进行一个方便的动态切换和标记处理,如我们根据不同的进展阶段显示不同的相关信息,也可以随时保存当前的阶段信息.其实也是一个比较常 ...

  7. JAVAEE——宜立方商城09:Activemq整合spring的应用场景、添加商品同步索引库、商品详情页面动态展示与使用缓存

    1. 学习计划 1.Activemq整合spring的应用场景 2.添加商品同步索引库 3.商品详情页面动态展示 4.展示详情页面使用缓存 2. Activemq整合spring 2.1. 使用方法 ...

  8. ajax获取动态列表数据后的分页问题

    ajax获取动态列表数据后的分页问题 这是我在写前台网站时遇到的一个分页问题,由于数据是通过ajax的方式来请求得到的,如果引入相应的js文件来做分页,假如只是静态的填放数据到列表各项内容中(列表条数 ...

  9. [python] 排序的动态展示

    两句闲话 本文所说的排序是指基于交换的排序.因此,按理来说,本文应该叫基于交换的排序的动态展示,但是这样太拗口了. 效果展示 最终效果如下. 实现方法 需要说明的是,在这里是通过pygame来实现图形 ...

随机推荐

  1. HDU 6039 Gear Up(线段树+并查集)

    [题目链接] http://acm.hdu.edu.cn/showproblem.php?pid=6039 [题目大意] 给出一些齿轮,有些齿轮是边相连,也就是拥有相同的线速度, 有的齿轮是轴相连,也 ...

  2. 【优先队列】POJ1442-Black Box

    [思路] 建立一个小堆和一个大堆.大堆用来存放第1..index-1大的数,其余数存放在大堆,小堆的堆顶元素便是我们要求出的第index大的数.每次插入一个A(n),必须保证大堆中数字数目不变,故先插 ...

  3. ncnn阅读 - CMakeLists.txt

    CMAKE_TOOLCHAIN_FILE This variable is specified on the command line when cross-compiling with CMake. ...

  4. jquery ajax 的封装

    var tooAjaxData = new Object(); tooAjaxData = function () { this.AjaxUrl =" ";}; bookInfoC ...

  5. [经验]我的电脑只有IE64位浏览器能上网,其他软件都上不了网

    [网上案例] 1.“我的电脑是VISTA 系统 昨天还好好的 进早上就显示什么Windows通信端口初始化失败 而且连不上网 求强人帮忙”2.“正常关机,第二天开机后,无法上网了所有浏览器,除了ie6 ...

  6. 连接mysql时1045错误的解决办法

    重装系统后,今天mysql提示1045错误无法连接上,找了很久得出方法如下: 修改root密码即可正常. 1,进入mysql控制台选择: 2,use mysql; 3,update user set ...

  7. Inno Setup入门(二十二)——Inno Setup类参考(8)

    http://379910987.blog.163.com/blog/static/33523797201121331832201/ 列表框 列表框(ListBox)是Windows应用程序中重要的输 ...

  8. Inno Setup入门(二十一)——Inno Setup类参考(7)

    复选框 复选框(CheckBox)用于多个并不互斥的几个选项中作出一个或者多选择,例如字体可以有粗体.斜体和下划线,这三种状态可以任意组合,像这样的选项可以采用复选框实现.Pascal脚本中对应的类是 ...

  9. Microsoft office(2)多级标题的设置

    在Microsoft office中要达到下面的标题结构: 1.首先将文字准备好: 2.将“绪论”,“无线...介绍”等章节标题分别选中 :段落-->大纲级别-->1级 3.同样的,“研究 ...

  10. nyoj42一笔画问题(欧拉图)

    这题事实上说不上难度4.仅仅是一个简单的欧拉图推断,给一些点,首先推断连通性.假设不连通.就谈不上是欧拉图. 假设是连通的,在推断度的数目,每一个顶点都是偶数个或者仅仅有两个是奇数个.这样就能够构成欧 ...