JQuery EasyUI combobox 省市两级联动

表名:province 结构如下

CallIn.tpl 模板页
<select id="consult_province" name="consult_province" class="easyui-combobox" style="width:200px;"><{$json_province}></select></td>
<input id="consult_city" name="consult_city" class="easyui-combobox" data-options="valueField:'id',textField:'text'" style="width:200px;" >
<script type="text/javascript"> //省份 下拉菜单 联动 城市
$("#consult_province").combobox({
onChange: function (n,o) { //alert('223323'); var selected_item=$('#consult_province').combobox('getValue');//省份
//alert(selected_item); /*
var data, json;
json='[{"id":1 , "text":"兰州" },{"id":14 ,"text":"敦煌" ,"selected":true},{"id":15 , "text":"临夏"}]';
data = $.parseJSON(json);
$("#consult_city").combobox("loadData", data);
*/ $.ajax({
type: "POST",
url: "Ajax-index.php?module=<{$module_name}>&action=Ajax_Province_Change",
dataType: "json",
data: {"data_item":selected_item },
beforeSend: function(){
//$('<div id="msg" />').addClass("loading").html("加载中...").css("color","#999").appendTo('.sub1');
},
success: function(json){
if(json.success==1){
//alert(json.msg);
//$("#consult_city option[value!=0]").remove(); //导入批号 var data = $.parseJSON(json.msg);
$("#consult_city").combobox("loadData", data); }else{
$.messager.alert('消息','数据加载失败!','error');
return false;
}
}
}); }
});
</script>
CallIn.php
//省份 智能提示--------------------------------------------------------------------------
$option='<option value="0"></option>';
$strSql="SELECT distinct name FROM province where deleted=0 order by date_entered asc";
$result_rows=$db->query($strSql);
while($row=mysql_fetch_array($result_rows)){
//echo($row[0]);
$option.='<option value="'.$row[0] .'">'. $row[0] .'</option>';
}
$smarty->assign('json_province', $option);
Ajax_Province_Change.php
$province = stripslashes(trim($_POST['data_item']));
$select=" SELECT city_name ";
$select.=" FROM province WHERE deleted=0 and name='" . $province . "' "; $result=$db->query($select);
$Select_Option="[";//
$i=1;
while($row=$db->fetch_array($result)){
$value=$row[0];
if($i==1){
$Select_Option=$Select_Option . '{"id":"' .$value. '" , "text":"' . $value .'","selected":true },';
}
else{
$Select_Option=$Select_Option . '{"id":"' .$value. '" , "text":"' . $value .'" },';
}
$i=$i+1;
}
$Select_Option = substr($Select_Option,0,-1);
$Select_Option=$Select_Option . ']'; $arr['success'] = 1;
$arr['msg'] = $Select_Option;
echo json_encode($arr);
JQuery EasyUI combobox 省市两级联动的更多相关文章
- jquery easyui Combobox 实现 两级联动
具体效果如下图:
- JS 省市两级联动(不带地区版本)
基于网上找的一个版本改造,因为项目需求不需要地区只要省.市,所以做了改版,两个input上直接取出了数据 <html> <head> <script src=" ...
- Combobox下拉框两级联动
下拉框的两级联动是我们开发中经常遇到一种情况.比如一个学生管理系统中,根据年级.科目及姓名查询学生考试成绩,年级和科目都是硬盘中的有限数据(数据库)而学生则可以有用户手动指定,这时在数据库中有年级和科 ...
- JQuery EasyUI Combobox的onChange事件
html中的select 的change事件 <select id="consult_province" name="consult_province" ...
- jquery easyui combobox 级联及触发事件,combobox级联
jquery easyui combobox 级联及触发事件,combobox级联 >>>>>>>>>>>>>>&g ...
- ajax实现无刷新两级联动DropDownList
ajax实现的无刷新三级联动 http://zhangyu028.cnblogs.com/articles/310568.html 本文来自小山blog:http://singlepine.cnblo ...
- JS练习:两级联动
代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title ...
- jquery.cityselect.js基于jQuery+JSON的省市或自定义联动效果
一.插件介绍 最早做省市联动的时候都特别麻烦,后来在helloweba的一篇文章中看到这个插件,很不错的,后来就一直用了. 省市区联动下拉效果在WEB中应用非常广泛,尤其在一些会员信息系统.电商网站最 ...
- easyui commobox省市区县三级联动
1.前端代码 <div class="col-6 f-group"> <label class="col-4 left_red"> 省名 ...
随机推荐
- sonarqube 5.6
转载:https://www.jianshu.com/p/402987500bfd 一. 简介 Sonar是一个用于代码质量管理的开源平台,用于管理源代码的质量.通过插件形式,可以支持包括java,C ...
- mybatis自定义枚举转换类
转载自:http://my.oschina.net/SEyanlei/blog/188919 mybatis提供了EnumTypeHandler和EnumOrdinalTypeHandler完成枚举类 ...
- 3611: [Heoi2014]大project|树形DP|虚树
构建出虚树然后DP统计答案 自己写的DP太傻QAQ,各种WA 膜了一发PoPoQQQ大爷的DP方法 mxdis,mndis分别表示到当前点近期和最远的被选出来的点的距离 mx,mn分别表示在以当前点为 ...
- Mycat读写分离、主从切换学习(转)
http://blog.csdn.net/zhanglei_16/article/details/50707487 Mycat读写分离.主从切换学习问题一:分表.分库的优缺点,以及分表无法成为主流分表 ...
- VS2015 之 多行缩进
VS2015工具栏缺少“多行缩进工具”,经查阅资料总结如下: 首先,选中需要缩进的行代码: 1.增大缩进:“Tab”键 2.减小缩进:“Shift”键 + “Tab”键
- 杂货&&心跳
https://github.com/jsfront/month/blob/master/2016/201605.md https://github.com/abdmob/x2js https://l ...
- 【转】Window 通过cmd查看端口占用、相应进程、杀死进程等的命令
转自:http://blog.csdn.net/jiangwei0910410003/article/details/18967441 一. 查看所有进程占用的端口 在开始-运行-cmd,输入:ne ...
- MySQL快速建立测试表
1:只要已经存在表结构的 第一种方式: CREATE TABLE T1 SELECT * FROM mysql.user ; 第二种方式: CREATE TABLE T2 LIKE mysql.use ...
- SpringMVC学习笔记五:使用converter进行参数数据转换
转载请注明原文地址:http://www.cnblogs.com/ygj0930/p/6832898.html 一:SpringMVC数据绑定机制 1:request到达SpringMVC框架时,框 ...
- 由一次 symbol lookup error 引发的思考
开发一个跨平台的项目的时候,大部分时候都是在VS下进行编码,所以也就使用了VS的解决方案来管理项目. 因为要跨平台,当时网上看scons这个工具不错,所以在linux下就使用了scons来作为编译脚本 ...