作者:62755 | 来源:互联网 | 2023-06-07 16:14
在页面中的分组下拉列表中选择的一条分组数据,在后面人员框中显示该分组下的所有人员(注意人员有多个,用户可以选择任意多个人员)由于分组人员数据较少,所以在第一次查询时已经查询出所有分组
在页面中的分组下拉列表中选择的一条分组数据,在后面人员框中显示该分组下的所有人员(注意人员有多个,用户可以选择任意多个人员)
由于分组人员数据较少,所以在第一次查询时已经查询出所有分组下的所有人员信息,前台根据下拉框筛选具体的人员,代码为:
//后台传给前台的数据位String格式
str ="group1:user1,user2,user3;group2:user1,user2,user3;"
//前台将str转成map格式
var map = {};
var str = "${str}";
var members = str.split(";");
for (i = 0; i ) {
var data = members[i].split(":");
map[data[0]] = data[1];
}
1. 首先监听下拉框,js代码为:
1 //groupName是通过lay-filter="groupName"筛选的
2 var form = layui.form, layer = layui.layer;
3 form.on(‘select(groupName)‘, function(data){
4 //获取当前select选中的value值
5 var value = $("#groupName").val();
6 changeUsers(value);
7 });
注意!项目中select选择框使用onchange事件不起作用,原因未知,因此使用layui的select选择框的监听事件
2. changeUsers方法为填充数据,js代码为: