easyui中combotree与combobox并用动态加载数据

1 篇文章 0 订阅

最开始是做flex的,jsp这些东西懂,但是对ui框架这些东西就比较生疏了,最近在做微信的项目,公司后台框架是easyui的,做起来就比较费事了,今天遇到一个问题,就是用combotree把商品类型树状形式展示,对应的商品下拉框中会对应类型的改变而改变。在网上找了一些资料,没什么现成的,自己试了下,还是可以实现的。可能网上有,比较笨,没有找到。自己总结一下,方便以后看,也方便别人。


jsp页面中两个下拉框

<span style="font-family: Arial, Helvetica, sans-serif;"><tr></span>
				<td align="right">商品类型:</td>
				<td align="left">
					<input style="width:200px;" name="typeParent" id="typeParent" class="easyui-combotree" data-options="url:'goodstype/list.html?parentId=0',
					onBeforeExpand:function(node){$('#typeParent').combotree('tree').tree('options').url = 'goodstype/list.html?parentId='+node.id;},
					onLoadSuccess:function(){$('#typeParent').combotree('tree').tree('expandAll');},panelHeight:'250'"/>
				</td>
			</tr>
			<tr>
				<td align="right">所属商品:</td>
				<td align="left">
					<select name="goodsId" id="goodsId" editable="false" style="width:200px;" required="true" class="easyui-combobox" 
						data-options="
							url:'goods/selGoodsByType.html',
							valueField:'gid',
							textField:'goodsName',
							panelHeight:'auto'
							
					"></select>
				</td>
			</tr>


js代码

$('#typeParent').combotree({onSelect:function(node) {
		$('#goodsId').combobox({ 
	    	url:'goods/selGoodsByType.html?typeId='+node.id,
			valueField:'gid',
			textField:'goodsName',
			panelHeight:'auto'
		});
  		}
	})

有什么问题可以一起讨论

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
easyui-combotree是一种基于EasyUI框架的组件,用于在网页创建一个带有树状结构的下拉菜单。它可以用于选择树状结构的某个节点。通过设置相关参数,可以实现默认选多项、选择节点以及获取节点信息等功能。你可以使用HTML代码来创建一个easyui-combotree,如下所示: ``` <input id="ProjectTree" class="easyui-combotree" style="width: 300px;" /> ``` 在后端代码,你可以通过获取区域节点信息的方式来提供easyui-combotree所需的数据。例如,在后端代码可以使用以下方法来获取三级区域菜单的数据: ```csharp public ActionResult GetThreeRegionTree(string parentRegionCode = "") { List<TreeRegionOne> treeOneList = new List<TreeRegionOne>(); var treeListModel = Sys_RegionServer.GetRegionChildList(parentRegionCode); foreach (var oneTreeItem in treeListModel) { TreeRegionOne treeOne = new TreeRegionOne(); treeOne.id = Convert.ToInt32(oneTreeItem.Value);//下拉框value值 treeOne.text = oneTreeItem.Text;//显示文本 treeOne.state = "open";//显示的是文件夹样式还是文档样式,也就是是否最后一级 //是否有子节点 var childList = Sys_RegionServer.GetRegionChildList(oneTreeItem.Value); if (childList != null && childList.Count() > 0) { treeOne.state = "closed"; } treeOneList.Add(treeOne); } return Json(treeOneList); } ``` 上述代码,通过遍历区域节点信息,构建一个TreeRegionOne对象列表,包含了节点的id、显示文本和是否有子节点等信息。最后,通过Json方法返回这个列表作为easyui-combotree数据源。这样,easyui-combotree就会显示出相应的树结构,并且可以根据你的需求进行选择和操作。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *3* [easyui combotree(树形下拉框)使用收获总结](https://blog.csdn.net/weixin_44311648/article/details/118654862)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"] - *2* [easyui学习记录:combotree的使用](https://blog.csdn.net/weixin_30319153/article/details/97892869)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值