1. $(document).ready(function(){
  2. var treeObj = $("#treeDemo");
  3. $.fn.zTree.init(treeObj, setting, zNodes);
  4. department_select();//页面加载完成执行方法
  5. });
  6. /*ztree实现下拉菜单*/
  7. var setting = {
  8. data: {
  9. simpleData: {
  10. enable: true,
  11. idKey: "id",
  12. pIdKey: "pId",
  13. rootPId: 0
  14. }
  15. }
  16. };
  17. /*通过查询area确定区域,根据区域id确定下面的部门*/
  18. /*将数据库里面的部门信息查询出来,循环显示出来*/
  19. /*获取区域id和区域名称*/
  20. var arr_areaid = Array();
  21. var arr_areaname = Array();
  22. var url="{:U('area/select_area')}";//ajax传值路径
  23. $.ajax({
  24. type:'post',
  25. data:"",
  26. url:url,
  27. async:false,//设置ajax同步和 异步,如果想在ajax外面用数据,需要将其设置为同步,运行完成之后才能用数据
  28. dataType:"json",
  29. success: function (data) {
  30. for(var i = 0;i < data.length;i++){
  31. arr_areaid[i] = data[i].areaid;
  32. arr_areaname[i] = data[i].areaname;
  33. }
  34. }
  35. });
  36. // console.log("!!!"+arr_areaid);//区域id
  37. // console.log("!!!"+arr_areaname);//区域名称
  38. /*获取部门名称以及所属于的区域id*/
  39. var arr_departmentname = Array();
  40. var arr_department_areaid = Array();
  41. var url="{:U('department/select_department')}";//ajax传值路径
  42. $.ajax({
  43. type:'post',
  44. data:"",
  45. url:url,
  46. async:false,
  47. dataType:"json",
  48. success: function (data) {
  49. for(var i = 0;i < data.length;i++){
  50. arr_departmentname[i] = data[i].departmentname;
  51. arr_department_areaid[i] = data[i].areaid
  52. }
  53. }
  54. });
  55. // console.log(arr_departmentname);
  56. // console.log(arr_department_areaid);
  57. var zNodes =[];
  58. for(var i = 0;i < arr_areaid.length;i++){
  59. zNodes.push({ id:arr_areaid[i], pId:0, name:arr_areaname[i], open:true,iconClose:"__PUBLIC__img/user/12.png",iconOpen:"__PUBLIC__img/user/13.png"});
  60. for(var j = 0;j < arr_departmentname.length;j++){
  61. if(arr_areaid[i] == arr_department_areaid[j]){
  62. zNodes.push({ id:(""+i+13+j), pId:arr_areaid[i], name:arr_departmentname[j],icon:"__PUBLIC__img/user/14.png"}) ;
  63. }
  64. }
  65. }

ztree连接数据库,实现下拉菜单的更多相关文章

  1. z-tree官方提供的下拉菜单案例

    1.z-tree官方提供的下拉菜单案例 <!DOCTYPE html> <HTML> <HEAD> <TITLE> ZTREE DEMO - selec ...

  2. zTree插件之多选下拉菜单代码

    zTree插件之多选下拉菜单代码 css和js <!--ztree树结构--> <link rel="stylesheet" type="text/cs ...

  3. zTree下拉菜单多级菜单多选实现

    惯例,先上图: 这是在一个项目中,为了满足样式美观.多级菜单以及多选而将zTree插件更改过后的效果. 在实际的开发过程中,本来zTree也是可以满足需求的,但是zTree多选的话需要checkbox ...

  4. ajax三级联动下拉菜单

    ajax写三级联动,先写一个文件类吧,以后用的时候直接调用即可: 来找一张表: 实现: 中国地域的三级联动:省.市.区: 图: 说一下思路: (1)当用户选择省份的时候触发事件,把当前的省份的id通过 ...

  5. 初学者--bootstrap(六)组件中的下拉菜单----在路上(10)

    组件---下拉菜单 用于显示链接列表的可切换.有上下文的菜单.下拉菜单的 JavaScript 插件让它具有了交互性. 将下拉菜单触发器和下拉菜单都包裹在 .dropdown 里,或者另一个声明了 p ...

  6. Bootstrap3系列:按钮式下拉菜单

    1. 基本实例 把按钮放入 .btn-group 中,加入适当的菜单标签,让按钮触发下拉菜单. 1.1 示例代码 <div class="btn-group"> < ...

  7. Bootstrap3系列:下拉菜单

    1.引用Bootstrap 示例引用的Bootstrap版本:v3.3.7 <script src="~/Scripts/jquery-2.2.4.min.js">&l ...

  8. 如何在webapp中做出原生的ios下拉菜单效果

    github:https://github.com/zhoushengmufc/iosselect webapp模仿ios下拉菜单 html下拉菜单select在安卓和IOS下表现不一样,iossel ...

  9. Html5+Css3制作下拉菜单的三种方式

    一.渐变式改变ol的高度 1.外部为ul标签,在每个li里嵌套一个ol列表2.设置外部li左浮动,内部ol标签绝对定位,外部li标签相对定位3.设置ol的高为0,溢出隐藏4.外部li标签:hover ...

随机推荐

  1. WiFi相关基础概念

    转自:https://blog.csdn.net/lbaihao/article/details/73250798 一.WiFi相关基础概念 1.什么是wifi 我们看一下百度百科是如何定义的: Wi ...

  2. set 集合————两个数组的交集

    class Solution { public: vector<int> intersection(vector<int>& nums1, vector<int& ...

  3. HDU 5912 Fraction

    题目来源:2016 CCPC 长春站 题意:青蛙先生想计算一个式子的值,输入两个数列a[],b[]求出最后的分子和分母 思路:一开始看到这个图片首先想到的是递归实现,递归部分始终计算的是右下部分 /* ...

  4. nignx 502错误不能使用/的路径方式 即pathinfo

    在server中加入 include enable-php-pathinfo.conf; 引入nginx.conf下的这个文件即可. 如果是tp框架,主要隐藏index.php的入口文件,再加入下面这 ...

  5. 【BZOJ 1305】[CQOI2009]dance跳舞

    [链接] 我是链接,点我呀:) [题意] 在这里输入题意 [题解] 男生和女生每个人都分身成两个节点 即x[1],x[2]和y[1],y[2] 然后如果i和j不相互喜欢 那么add(x[i][2],y ...

  6. Git学习总结(9)——如何构建你自己的 Git 服务器

    现在我们将开始学习如何构建一个Git服务器,如何在具体的事件中写一个针对特定的触发操作的自定义Git(例如通告),如何发布你的代码到一个网站. 目前为止,用户对Git的焦点主要在Git的使用上.这篇文 ...

  7. Java并发编程(七)ConcurrentLinkedQueue的实现原理和源码分析

    相关文章 Java并发编程(一)线程定义.状态和属性 Java并发编程(二)同步 Java并发编程(三)volatile域 Java并发编程(四)Java内存模型 Java并发编程(五)Concurr ...

  8. php学习之道:php empty()和isset()的差别

    在使用 php 编写页面程序时,我常常使用变量处理函数推断 php 页面尾部參数的某个变量值是否为空,開始的时候我习惯了使用 empty() 函数,却发现了一些问题,因此改用 isset() 函数,问 ...

  9. xcode5.1生成framework,支持arm64报错

    错误例如以下: ld: Assertion failed: (_machoSection != 0), function machoSection, file /SourceCache/ld64/ld ...

  10. PE文件结构(三) 输入表

    PE文件结构(三) 參考 书:<加密与解密> 视频:小甲鱼 解密系列 视频 输入表 输入函数,表示被程序调用可是它的代码不在程序代码中的,而在dll中的函数.对于这些函数.磁盘上的可执行文 ...