欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

easyui中下拉列表根据选项动态设置高度

程序员文章站 2022-05-19 08:54:58
...

我们在easyui中可以动态的为下拉框添加选项,但是当我们点击下拉的时候,展示的下拉框的高度过于高了,我们可以手动的调试 它的高度,书写语法与jq的语法类似,easyui有自己单独的语法,具体代码如下

<select id="teacherSelect" class="easyui-combobox" name="teacherId" data-options="width:100"></select>





<script type="text/javascript">
   $(function(){
		$.ajax({
			url : "${pageContext.request.contextPath}/user/selectAllTeacher",
			dataType : "json",
			success : function(result){
                //定义一个选项的数组,我为它添加了一个选项
				var options = [{text:"无上师",value:""}];
                //在这里我定义的一个选项的高度是23,根据自己的显示器而定
				var height = 23;
				$.each(result,function(index,teacher){
					options.push({
						text : teacher.nickname,
						value : teacher.id
					});
                    //每次添加一个选项,高度增加23
					height += 23;
				});
				//设置其高度
				$("#teacherSelect").combobox({"panelHeight":height});
                //读取本地列表数据
				$("#teacherSelect").combobox("loadData",options);
			}	
		});
	});
</script>

最后应该先设置其高度,再读取本地数据,顺序不要颠倒

相关标签: easyUI