大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。
Jetbrains全家桶1年46,售后保障稳定
先简单介绍下combobox:
easyUI重写了select,取而代之的是combobox,有如下几种方式可以创建一个combobox
1、使用select标签,并加上class=”easyui-combobox”,这种方式比较适用于静态的选项
2、使用input标签,并加上class=”easyui-combobox”,后面跟上data-options,可以用local或是remote方式加载数据
3、使用js方式,和2基本相同,只是把combobox一些属性的设置分离到了js中
下面是级联的思路:
combobox实现级联基本上和select类似,比如省份和城市的级联
当省份选完这个事件发生之后,城市的选择框里就会刷新数据,得到当前省份下的所有城市
那么关键点就是——》接收事件——》刷新第二级的选择框
combobox有提供onSelect这个事件点,且传入一个选中的记录rec,比如说我们可以取rec的主键rec.id(比如是浙江,id是29),那么我们可以拿到这个29去后台查询浙江省下的城市Json数据,这串Json就是需要放到城市combobox中的数据
那么开始动手吧:
<tr>
<td>省份:</td>
<td><input class="easyui-combobox" name=”province” data-options="
method:'get',
mode:'remote',
url:'test/getProvinceList',
onSelect:function(rec){
$('[comboname=city]').combobox('clear');
$('[comboname=city]').combobox('reload', 'test/getCityListByProvince?id=' + rec.id);
},
onLoadSuccess:function(){
var value = $(this).combobox('getValue');
if(value != ''){
<span style="white-space:pre"> </span>$('[comboname=city]').combobox('reload', 'test/getCityListByProvince?id=' + $(this).combobox('getValue'));
}
}
">
</td>
<td>城市:</td>
<td><input class="easyui-combobox" panelHeight="auto" name="city" data-options="
prompt:'请先填入省份名称'
">
</td>
</tr>
使用中可能碰到的问题:
1、为combobox指定name后,经过easyUI自己解析后,生成的combobox(也就是select)没有name这个属性,取而代之的是comboname,因为name要作为input的name。所以要根据name得到combobox要使用comboname
2、$(‘[comboname=city]’).combobox(‘clear’); 这一步也是必要的,不然combobox中之前选中的值将无法清除,比如之前选的是浙江–杭州(id为1),若此时更改省份变为江苏,那么若不加clear,此时城市则变成当前省份id为1的城市,也就是南京(id为1)。要是此id在对应省份无记录,那么就只会显示一个id,那么显然不是我们想看到的。
发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/201103.html原文链接:https://javaforall.cn
【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛
【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...