jQuery EasyUI API 中文文档 - 下拉表格树（ComboTreeGrid）

ComboTreeGrid

由 $.fn.combo.defaults 和 $.fn.treegrid.defaults 扩展而来。

default 由 $.fn.combotreegrid.defaults 重载。

combotreegrid 是带有 treegrid 的下拉选择控件。它允许用户快速的从 treegrid 中查找和选择数据。combotreegrid 支持带有多选框的 treegrid。

依赖控件

• combo
• treegrid
  

用法

1、用HTML标记生成 combotreegrid；

<input class="easyui-combotreegrid" data-options="
            width:'100%',
            panelWidth:500,
            label:'Select Item:',
            labelPosition:'top',
            url:'treegrid_data1.json',
            idField:'id',
            treeField:'name',
            columns:[[
                {field:'name',title:'Name',width:200},
                {field:'size',title:'Size',width:100},
                {field:'date',title:'Date',width:100}
            ]]">

2、用javascript 生成 combotreegrid，可以从<select> 或 <input> 元素创建

<input id="cc" name="name">

$(function(){
    $('#cc').combogrid({
        value:'006',
        width:'100%',
        panelWidth:500,
        label:'Select Item:',
        labelPosition:'top',
        url:'treegrid_data1.json',
        idField:'id',
        treeField:'name',
        columns:[[
            {field:'name',title:'Name',width:200},
            {field:'size',title:'Size',width:100},
            {field:'date',title:'Date',width:100}
        ]]
    });
});

属性

属性扩展自combo 和 treegrid, 下面是为 combotreegrid 新增或重写的属性：

名称	类型	描述	缺省值
idField	string	节点的 id 值	null
treeField	string	当选中时，会被显示的树节点的字段	null
limitToGrid	boolean	输入的数据是否限制在表格所显示的范围内	false

事件

事件扩展自combo 和 treegrid 。

方法

方法扩展自 combo，下面是为 combotreegrid 新增或重写的方法：

名称	参数	描述
options	none	返回 options 对象.
grid	options	返回 treegrid 对象，下面的例子显示如何获取选择的行： var g = $('#cc').combotreegrid('grid'); // get treegrid object var r = g.treegrid('getSelected'); // get the selected row alert(r.name);
setValue	value	设置组件的值。例子： $('#cc').combotreegrid('setValue', '002'); $('#cc').combotreegrid('setValue', {id:'003',name:'name003'});
setValues	values	设置组件的一组值。例子： $('#cc').combotreegrid('setValues', ['001','007']); $('#cc').combotreegrid('setValues', ['001','007',{id:'008',name:'name008'}]);
clear	none	清除组件的值。

参考文档: http://www.jeasyui.com