文章詳情頁
ajax請求后臺得到json數據后動態生成樹形下拉框的方法
瀏覽:394日期:2022-06-11 14:22:05
如下所示:
<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. ajax4jsf 1.0.2 發布,添加新的a4j tags.2. Django與AJAX實現網頁動態數據顯示的示例代碼3. 使用AJAX(包含正則表達式)驗證用戶登錄的步驟4. layui的checbox在Ajax局部刷新下的設置方法5. 基于ajax后臺返回的數據為空前臺顯示出現undefined的解決方法6. 解決SpringMVC、tomcat、Intellij idea、ajax中文亂碼問題7. django執行數據庫查詢之后實現返回的結果集轉json8. 基于JSON的高級AJAX開發技術9. JavaScript JSON使用原理及注意事項10. 原生Ajax之全面了解xhr的概念與使用
排行榜
