Ext 动态加载 多选树

 

/** * name:Ext多选树* time:2011-3-11 author:向宇胜 */ Ext.onReady(function() { Ext.BLANK_IMAGE_URL = ctx + "/Script/ExtJs/resources/images/default/s.gif"; //Ext.util.CSS.swapStyleSheet("theme", ctx + "/Script/ExtJs/resources/css/xtheme-gray.css"); Ext.util.CSS.swapStyleSheet("theme", ctx + "/Script/ExtJs/resources/css/xtheme-slate/css/xtheme-slate.css"); //document.write('<mce:script src="/qdjg/Script/ExtJs/ext-lang-zh_CN.js" mce_src="qdjg/Script/ExtJs/ext-lang-zh_CN.js"></mce:script>'); }); /******************************************************************************* * 获取选节点 ******************************************************************************/ function getSelectValue() { var str = DWRUtil.getValue("check"); var ids = ""; var names = ""; for ( var j = 0; j < str.length; j++) { var array = str[j].split("-"); if(typeof(returnType) == "undefined" || returnType ==""){ //默认获取叶子 节点 if (array[2] == 'true') { ids += array[0]; names += array[1]; if (str.length - 1 != j) { ids += ","; names += ","; } } }else if(returnType == "node"){ if (array[2] == 'false') { ids += array[0]; names += array[1]; if (str.length - 1 != j) { ids += ","; names += ","; } } }else if(returnType=="all"){ ids += array[0]; names += array[1]; if (str.length - 1 != j) { ids += ","; names += ","; } } } var array = new Array(); array[0] = ids; array[1] = names; return array; } function showTree() { var root = new Ext.tree.AsyncTreeNode( { text : rootName, draggable : false, id : rootId }); var tree = new Ext.tree.TreePanel( { checkModel : check, // //多选: 'multiple'(默认) 单选: 'single' 级联多选: // 'cascade'(同时选父和子);'parentCascade'(选父);'childCascade'(选子) id:'tree', onlyLeafCheckable : onlyLeafCheckable, // 是否只有叶子节点可选 rootVisible : true, height : 400 - 68, //autoHeight:true, draggable : false, //width:width - 16, margins : '0 0 0 0', autoScroll : true, animate : true, enableDD : false, root : root, // You must define the root variable before when you set // the root config loader : new Ext.tree.TreeLoader( { dataUrl : dataUrl, baseAttrs : { uiProvider : Ext.ux.TreeCheckNodeUI } }) }); root.expand(); var win = new Ext.Window( { title : '请选择', id : 'win', plain:true, height : 400, width:250, //autoScroll : true, layout:"form", labelWidth:60, shadow :false, shadowOffset:0, animCollapse:true, modal : true, // 遮罩 items : tree }); var ok = new Ext.Button({ id:"ok", text:"确定" }); ok.on("click",function() { var array = getSelectValue(); //选中值array[0] 为ID，array[1]为名称,格式都为"xx,xx" if(array[0].length == 0){ Ext.Msg.alert("提示","您还没有选择！") return; } if (typeof (returnName) != "undefined" && returnName != "") { document.getElementById(returnName).value = array[1]; } if (typeof (returnId) != "undefined" && returnId != "") { document.getElementById(returnId).value = array[0]; } Ext.getCmp("win").close(); }) var clear = new Ext.Button({ id:"clear", text:"取消" }); clear.on("click",function () { // var array = getSelectValue();; //选中值array[0 为ID，array[1]为名称,格式都为"xx,xx" if (typeof (returnName) != "undefined" && returnName != "") { document.getElementById(returnName).value = ""; } if (typeof (returnId) != "undefined" && returnId != "") { document.getElementById(returnId).value = ""; } Ext.getCmp("win").close(); }) win.addButton(ok); win.addButton(clear); win.show(document); }

 

以上只是树的代码，后台采用Struts2 Jeson 的方式获取数据。

支持动态加载节点，支持父级多选，选父，单选。等多种选择。单击确定，返回ID和名称。