JQuery easyUI combobox 数据过滤(filter)

督烨赫
2023-12-01
1、jsp/js文件:

<select id="cc" class="easyui-combogrid" name="saleMan.id" style="width:200px;border:0;" 
     data-options=" 
    panelWidth:550, 
    value:'${order.saleMan.id }', 
    idField:'id',
    textField:'userName', 
    pagination:true,
    required:true, 
    editable:true,
     mode:'remote', // 如果为 'local'的话, 那么过滤的是本地数据, 默认是'local'
    url:'/sys/sysUserAccess/searchSaleMan.jhtml', 
    columns:[[ 
        {field:'userName',title:'姓名',width:100}, 
        {field:'account',title:'帐号',width:100}, 
        {field:'unitName',title:'组织',width:120,formatter:function(value,row){if(row.sysUnit!=null){ return             row.sysUnit.name;}}}, 
    ]],
     filter: function(q, row){
        var opts = $('#cc').combobox('options');
        return row[opts.textField].indexOf(q) == 0;
    },
     formatter:function(row){ 
        var opts = $('#cc').combobox('options');
        return row[opts.textField]; 
    }

"></select>
说明: 注意红色 和 加粗部分

2、 后台代码

    1)、定义全局变量 q, 
    2)、通过request.getParameter("q");
    然后将q作为参数,进行数据的筛选

    如: 
if (StringUtils.isNotBlank(q)) {
        for (int i = 0; i < users.size(); i++) {
            SysUser su = users.get(i);
            if (su.getAccount().contains(q)) {
                rList.add(su);
                continue;
            }
            if (su.getUserName().contains(q)) {
                rList.add(su);
                continue;
            }
            if (su.getSysUnit() != null && su.getSysUnit().getName().contains(q)) {
                rList.add(su);
            }
        }
} else {
    rList = users;
}

说明:  rList  是临时变量, 最为返回的数据
 类似资料: