EasyUI combobox下拉列表框--下拉列表框的onShowPanel事件

最新推荐文章于 2022-11-11 16:21:54 发布

原创最新推荐文章于 2022-11-11 16:21:54 发布 · 1.4w 阅读

0 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#easyui #onShowPanel #combobox

jQuery Easy UI 专栏收录该内容

8 篇文章

订阅专栏

本文介绍了在EasyUI中使用Combobox时遇到的问题：初始加载页面时，下拉列表框为空。为解决这个问题，利用onShowPanel事件，在用户打开下拉面板时动态加载数据。通过监听onShowPanel事件，当combobox下拉列表为空时，可以弹出提示或者进行数据填充操作。

1.原因：最近项目中有很多要用到combobox，但是如果这些数据是加载时获取，而且这些数据是从另一个模块手动添加的话，那么一开始加载这个页面，当点击这个下拉列表框(combobox)，如：所属队伍时，它里面是没值可选的，就像下面这种情况

2.解决方法：当点击所属队伍时，如果下拉类别框为空，弹一个提示，用到的事件是onShowPanel

onShowPanel:当下拉面板显示时触发的事件

3.代码

<span style="font-family:Microsoft YaHei;font-size:14px;">$('#teamId').combotree({
	url: 'retmmat/tree',
	required: true, 
	valueField: 'id',
	onSelect: function(node){
		$('#team').val(node.text);
	},
	<strong>onShowPanel:function()</strong>{
	if(($("#teamId").combotree('tree').tree('getRoots').length)==0){//获取树形对象并判断树形对象的根元素的个数是否为空
		$(this).combo('hidePanel', true); //面板为空就隐藏面板
		alertMsg("提示","请先到队伍管理(队伍)模块添加队伍");</span></span>

<span style="font-family:Microsoft YaHei;font-size:14px;"><span style="font-family:Microsoft YaHei;"><span style="white-space:pre">		</span>return；
	};
}</span>