Easy-UI combotree多选

最新推荐文章于 2021-10-13 15:51:48 发布

原创最新推荐文章于 2021-10-13 15:51:48 发布 · 490 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#ui

Javascript 专栏收录该内容

116 篇文章

订阅专栏

本文介绍了如何在网页中使用Easyui Combotree组件实现多选功能，包括组件配置、数据加载及事件处理，并提供了完整的示例代码及效果展示。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

页面：
获得多选值的方法是


$('#cc').combotree('getValues');

[color=red]multiple="false"选项表示可以多选[/color]


<td><span id="xx" class="xxx-i18n">xxx：</span></td>
<td><input id="cc" class="easyui-combotree" multiple="false" style="width: 190px;"  panelHeight="100px"></td>


//加载input标签的下拉框
$('#cc').combotree({
url: 'xxxx.do?method=selectAll&nodeid='+ids,		
 onChange:function(node){
   clientid = $('#cc').combotree('getValues');
$.getJSON('xx.do',								                               {'xx':xx},
function(item){
   if (item.success=='ok') {
       //如果不存在
    } else {			
//判断是否要替换所选的值
$.messager.confirm("提示",item.success+",是否替换？\n\t",function(r){
 if (r){
    //点击是替换
}else{
   //点击否
$("#cc").combotree('setValue',[""]);											}																	});
}										
})
}

});

后台代码


    @RequestMapping(params = "method=xxx")
    @ResponseBody
    public Object xxx(String nodeid)
    {
        List<Map<String, Object>> result = new ArrayList<Map<String, Object>>();
        try
        {
            List<xxx> list = xxx.findAllxxx(nodeid);
            Map<String, Object> item1 = new HashMap<String, Object>();
            item1.put("id", "");
            item1.put("text", "请选择");
            result.add(item1);
            for (int i = 0; i < list.size(); i++)
            {
                Map<String, Object> item = new HashMap<String, Object>();
                xxx xxx= list.get(i);
                item.put("id", xxx.getEventid());
                item.put("text", xxxx.getXXX());
                result.add(item);
            }
        }
        catch (Exception e)
        {
            e.printStackTrace();
        }
        return result;
    }