博客贡献于:dojo技术交流群(35476066)
作者:spring
这上面是一个用户的基本信息表单,那么组织结构这里是一个可选择的DropdownTree,现在我们就是要做这么一个通用的DropdownTree
我们的组织结构的html是这样一个代码片段:
<td width="90px"><label>组织机构</label></td> <td> <input type="hidden" name="organizationId" dojoType="dijit.form.TextBox"> <div dojoType="dijit.form.TextBox" name="organizationName" readonly="true" style="160px"></div> <div><div data-dojo-type="app.widget.DropDownTree" url="system/organization/tree"></div></div> </td>
这里需要编写一个app.widget.DropDownTree的js文件,然后每次当我面使用的时候只需要复制然后修改<div><div data-dojo-type="app.widget.DropDownTree" url="system/organization/tree"></div></div> 中的url即可:
define([ "dojo/_base/declare", "dojo/data/ItemFileReadStore", "dijit/tree/TreeStoreModel", "dijit/Tree", "dijit/TooltipDialog", "dijit/form/DropDownButton", ], function(declare,ItemFileReadStore,TreeStoreModel,Tree,TooltipDialog,DropDownButton){ return declare("app.widget.DropDownTree", null, { idInput: null, //id nameInput: null, //name appendTo: null, // 添加选择按钮 url: "config/equipment/treeall", //default load equipment tree //init widget method _initTree: function(){ this.treeStore = new ItemFileReadStore({ url: this.url, urlPreventCache:true }); var treeModel = new TreeStoreModel ({ store: this.treeStore, rootId:"root", rootLabel:"选择", query:{id:"root"}, childrenAttrs: ["children"], mayHaveChildren: function(item){return dojo.some(this.childrenAttrs, function(attr){ return this.store.hasAttribute(item, attr) && this.store.getValue(item,attr); }, this);} }); var parentTree = new Tree({ model: treeModel, showRoot:true , labelAttr:"name", style:{overflow: "auto","250px", height:"220px"} }); var roleParentTreeDlg = new TooltipDialog({ content: parentTree.domNode }); this.dropDwonButton_ = new DropDownButton({ label: "选择", iconClass: "configButtonIcon", dropDown: roleParentTreeDlg },this.appendTo); dojo.connect(parentTree,'onClick',dojo.hitch(this,this.confirmHandler)); }, confirmHandler: function(item,treeNode){ var id = this.treeStore.getValue(item,"id"); var name = this.treeStore.getValue(item,"name"); this.idInput.setValue(id); this.nameInput.setValue(name); }, constructor: function(_arg){ dojo.mixin(this, _arg); this.inherited("constructor", arguments); this.appendTo = arguments[1].parentNode; this.idInput = dijit.getEnclosingWidget(this.appendTo.parentNode.children[0]);//通过dom节点获得widget对象 this.nameInput = dijit.getEnclosingWidget(this.appendTo.parentNode.children[1]); this._initTree(); }, uninitialize: function(){ if(this.dropDwonButton_){ this.dropDwonButton_.destroyRecursive(); delete this.dropDwonButton_; } this.inherited(arguments); } }); });