easyui combotree加载字典数据

最新推荐文章于 2023-03-06 11:08:28 发布

VIP文章慢慢成长的我

最新推荐文章于 2023-03-06 11:08:28 发布

阅读量3k

点赞数

分类专栏： easyui学习文章标签： easyui combotree

本文链接：https://blog.csdn.net/u012027337/article/details/51436937

版权

网上有很多easyui关于combotree的文章，但是看来看去也没有找到合适那种可以实现远程加载数据字典数据的例子，只能私下自己仔细研究了一下combotree控件，这次实现的主要功能就是把数据字典里面的数据加载到combotree的下拉树。

实现效果如下图：

当点击任意一个有下级节点的节点,会加载该节点对应的下级节点的数据，效果如下：

<body>
     <div class="easyui-layout" data-options="fit:true">
          <input class="easyui-combotree" style="width:150px;" data-options="required:true,editable:false,onChange:function(){toUpOtherPage()}" id="typeCode" name="typeCode"/>
     </div>
  </body

typeCode是组合框的id，我们需要使用页面元素调用combotree是组合框函数头来做相关处理</span>

下面我们看看，怎么在编辑页面初始化数据：

<pre class="javascript" name="code"></head>
  <script type="text/javascript">
  
  $(document).ready(function(){
	  // 第一个参数：字典项ID -1表示顶级
	  //第二个参数：字典编码    DIC_WS218_2002_A
	  getCombotree('-1', 'DIC_WS218_2002_A');
	  })
 function getCombotree(dictionaryId,dictionaryCode){
	  $("#typeCode").combotree({
		  //定义在文本改变时如何加载列表数据。如果组合框（combobox）从服务器加载就设置为 'remote'。
		  //当设置为 'remote' 模式时，用户输入的值将会被作为名为 'q' 的 http 请求参数发送到服务器，以获取新的数据。
		  mode: 'remote',
	   	  lines:true,//定义是否显示树线条
	   	  panelWidth:200,//下拉面板的宽度
	   	  panelHeight:200,//下拉面板的高度  
		  url:"${base}/dictionaryItem/queryItemTreeListByCode.action?itemId="+dictionaryId,
		  queryParams:{"dictionaryCode":dictionaryCode},
		  onBeforeExpand:function(node){//节点展开前触发,是在点击节点前做处理； 这个是为了实现异步加载子节点
			 
			//$("#typeCode").combotree("tree")表示：得到树对象
			var tree=$("#typeCode").combotree("tree");
		    //得到树的options对象
			var options=tree.tree("options");
		    //访问后台获取子节点的url地址
		    //queryItemTreeListByCode.action:查询字典项某节点下一级树数据
		    //queryItemTreeListByCode返回的数据为：List<DictionaryItemTreeDataVO>
			 options.url= "${base}/dictionaryItem/queryItemTreeListByCode.action?itemId=&

最低0.47元/天解锁文章

慢慢成长的我

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
easyui combotree加载字典数据

网上有很多easyui关于combotree的文章，但是看来看去也没有找到合适那种可以实现远程加载数据字典数据的例子，只能私下自己仔细研究了一下combotree控件，这次实现的主要功能就是把数据字典里面的数据加载到combotree的下拉树。实现效果如下图：当点击任意一个有下级节点的节点,会加载该节点对应的下级节点的数据，效果如下：
复制链接

扫一扫