文章详情页
ajax请求后台得到json数据后动态生成树形下拉框的方法
如下所示:
<select id="cc" name="rempId" data-options="required:true"></select>
<script> $(function(){ $.ajax({ url:"departmentAction_getAllDep.action", type:"post", success:function(result){ //console.log(result); $("#cc").combotree("loadData",b1(result)); } }); $("#cc").combotree({ animate:true, //选择树节点触发事件 onSelect : function(node) { n = node; //返回树对象 var tree = $(this).tree; //选中的节点是否为叶子节点,如果不是叶子节点,清除选中 var isLeaf = tree("isLeaf", node.target); if (!isLeaf) { //清除选中 $("#cc").combotree("clear"); } } }); }); var tree = { id:"", text:"", state:"", checked:"", iconCls:"", attributes:"", children:"" } function b1(result){ var t = []; $.each(result,function(index,dept){ t[index] = b2(dept); }); return t; } function b2(dept){ var tree = new Object(); tree.id = dept.depId; tree.text = dept.depName; tree.state = "closed"; tree.checked = "false"; if(dept.employees.length != 0){ tree.children = b3(dept.employees); }else{ tree.children = []; } return tree; } function b3(employees){ var easyTree = []; $.each(employees,function(index,item){ easyTree[index] = b4(item); }); return easyTree; } function b4(item){ var tree = new Object(); tree.id = item.empId; tree.text = item.empName; if(item.empSex == "男"){ tree.iconCls = "icon-nan"; }else{ tree.iconCls = "icon-female"; } return tree; } </script>
department表中的dept_id作为employee表中有的外键,生成的Department.java类中有Set<employee>对象。从后台查询部门表,得到List<Department>集合,通过struts2配置:
<action name="departmentAction_*" method="{1}"> <result name="getAllDep" type="json"> <param name="root">list</param> </result> </action>
转成json格式后,传到jsp页面,在前台页面中处理json数据,动态生成下拉树。
以上这篇ajax请求后台得到json数据后动态生成树形下拉框的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持。
标签:
Ajax
相关文章:
1. 基于ajax后台返回的数据为空前台显示出现undefined的解决方法2. JSON在Java中的相互转换示例详解3. 详解php中implode explode serialize json msgpack性能对比4. Java Json字符串的双引号("")括号如何去掉5. 以 XUL-Java-AJAX-Beanshell 的 ZK 1.0 發佈6. ajax实现从后台拿数据显示在HTML前端的方法7. Java 如何解析key为动态的json操作8. 面试必备之ajax原始请求9. ASP调用WebService转化成JSON数据,附json.min.asp10. laravel ajax curd 搜索登录判断功能的实现
排行榜