构建 TreeListView 类的新实例。
全称 | mx.controls.TreeListView |
命名空间 | mx.controls |
类 | TreeListView |
继承层次结构 | TreeListViewPagedControlControl |
源文件 | ~\mx\scripts\controls\TreeListView.js |
JavaScript 代码 |
var treeList = new mx.controls.TreeListView({
type: "local",
images:
[
{ itemType: "folder", imageUrl: "$/icons/folder.png" },
{ itemType: "role", imageUrl: "$/icons/role.png" }
], // 控件中所有使用的图片集合
itemMenu:
{
items:
[
{ name: "appendRoot", text: "添加根节点" },
{ name: "append", text: "添加子节点" },
"-",
{ name: "remove", text: "删除" }
],
onitemclick: _toolStrip_itemclick
}, // 定义数据项的右键菜单
columns:
[
{ name: "name", text: "名称" },
{ name: "value", text: "值" }
], // 定义列
items:
[
{
name: "Folder1",
value: "folder1",
itemType: "folder", // itemType 的值与 images 集合中对象的 name 属性值相对应,显示相应的图片
items:
[
{
name: "A1",
value: "a1",
itemType: "role"
}
] // Folder1 的子数据项节点
},
{
name: "Folder2",
value: "folder2",
itemType: "folder",
expanded: true, // 设置默认展开节点
items:
[
{
name: "Folder2-1",
value: "folder2-1",
itemType: "folder",
expanded: true,
items:
[
{
name: "B1",
value: "b1",
itemType: "role"
},
{
name: "B2",
value: "b2",
itemType: "role"
}
]
}
]
}
], // 定义数据项。可以嵌套,表示数据项子节点
onitemdoubleclick: _treeItem_doubleclick
});
function _treeItem_doubleclick(e)
{
alert("您双击的项的名称为:" + e.item.getValue("name"));
}
function _toolStrip_itemclick(e)
{
if (e.item.name == "appendRoot")
{
treeList.appendItem({
name: "root",
value: "根节点",
itemType: "folder"
});
}
} |
名称 | 说明 |
TreeListView() | 构建 TreeListView 类的新实例。 |
名称 | 说明 |
init() |
名称 | 说明 |
alias | 获取或设置一个字符串,表示控件的别名。 |
allColumns | 获取一个集合,包含控件中显示的所有 TreeListViewColumn 的集合。 |
allowDragging | 获取一个 Boolean 值,表示数据项节点是否允许拖拽。该字段必须在初始化前设置。 暂未提供行拖拽功能,该属性设置无效,暂时保留。 |
allowEditing | 获取和设置一个 Boolean 值, 该属性表示是否允许编辑。 |
allowPaging | 获取和设置一个 Boolean 值,表示是否可以分页。 |
autoLoad | 获取或设置一个 Boolean 值,该属性表示是否自动执行远程数据加载。 |
baseUrl | 获取或者设置一个属性,表示数据加载的服务地址。请参见 RESTClient.baseUrl |
border | 获取控件的边框样式。如“1px solid red”,表示边框的样式为 1 像素红色的实线。请使用 setBorder 方法设置该字段的值。 |
bottom | 获取控件的下边界与父容器下边界的像素距离。请使用 setBottom 方法设置该字段的值。 |
client | |
columns | 获取一个集合,包含控件中第一层列 TreeListViewColumn 与列分组 TreeListViewColumnGroup 的集合。 |
contextMenu | 一个 ContextMenu 对象,表示控件的右键菜单。 |
cssClass | 指定css伪类名称,设置控件显示样式 |
dicts | 获取或者设置一个数组,该值表示数据项的数据字典。例如: [ {name: "gender", values:[{text: "女", value: "female"}, {text: "男", value: "male"}]}, {name: "fruit", values:[{text: "苹果", value: "appple"}, {text: "香蕉", value: "banana"}]}, ] |
display | 获取控件的显示样式值。如“none”,表示隐藏控件; “block”表示强制作为块对象呈递。请使用 setDisplay。注:该"block"值不能在ComplexGrid控件中使用。 方法设置该字段的值。 |
displayCheckBox | 获取或者设置一个 Boolean 值,表示是否显示多选框。默认显示多选框。 |
displayHead | 获取一个 Boolean 值,表示是否显示列标题。请使用 setDisplayHead 方法设置该字段的值。 |
displayImage | 获取一个 Boolean 值,表示是否需要在 TreeListViewItem 中显示图标。该字段必须在初始化前设置。 |
displayRowNumber | 获取或设置一个 Boolean 值,表示是否需要显示行序号。 |
enabled | 获取控件是否可以对用户交互作出响应。如果该值为 true,则表示控件可以对用户交互作出响应;反之则不能。 请使用 setEnabled 方法设置该字段的值。 |
eTag | 获取控件的标签。 |
filter | 获取或设置一个 JSON 对象,该属性将用作数据加载的查询参数。 |
height | |
idField | 获取或设置一个属性,该属性将用作 TreeListView 中数据项的 id 值。 |
images | 获取一个集合,包含 TreeListView 中所有使用的图片。 |
imageSize | 获取 TreeListViewItem 图片的大小。该字段必须在初始化前设置。 |
itemCount | 获取和设置一个 Number 值,表示当前的总记录数。 |
itemMenu | 一个 ContextMenu 对象,表示数据项节点的右键菜单。 |
items | 获取一个集合,包含数据项列表中的根数据项(TreeListViewItem 类型)。请使用 setItems 方法设置该集合的值。 |
layoutConfigs | 获取或者设置一个 JSON 对象,该属性表示控件在父容器中的布局配置参数。该属性只有在控件父容器运用布局器才会生效。 |
left | 获取控件的左边界与父容器左边界的像素距离。请使用 setLeft 方法设置该字段的值。 |
padding | 获取控件的内边距。如“4px”表示上下左右的内边距均为 4 像素; “4px 2px 3px 1px”则表示上边距为 4 像素,右边距为 2 像素,下边距为 3 像素,左边距为 1 像素。请使用 setPadding 方法设置该字段的值。 |
pageIndex | 获取和设置一个 Number 值,表示当前第几页。 |
pageSize | 获取和设置一个 Number 值,表示当前每页允许显示的记录数。 |
pageSizeOptions | 获取和设置一个数组值,表示分页记录数可设置的选项。 |
parent | 获取控件所属的父对象。 |
permissionID | 获取或设置一个字符串,表示控件的权限标识。 |
position | 获取控件位置样式值。如“static”,表示无特殊定位,对象遵循 HTML 定位规则。请使用 setPosition
方法设置该字段的值。
该字段的可选值包括:
|
right | 获取控件的右边界与父容器右边界的像素距离。请使用 setRight 方法设置该字段的值。 |
searchBox | 设置或者获取一个 DataGridSearchBox 对象。 |
searchParamType | 获取或设置表格的查询条件类型。json 表示查询参数filter 的值采用 Json 对象的形式传递。string 表示查询参数 filter 的值采用字符串的形式传递。
该字段必须在初始化前设置。
该字段可选的值包括:
|
selection | 获取一个对象,表示 TreeListView 中当前选中的数据项节点(TreeListViewItem 类型)。 |
singleSelect | 获取或者设置一个 Boolean 值,表示是支持多选。该属性与 displayCheckBox 属性等价,建议使用 displayCheckBox属性。 |
top | 获取控件的上边界与父容器上边界的像素距离。请使用 setTop 方法设置该字段的值。 |
treeField | 获取或设置一个属性,该属性将用作 TreeListView 中数据项以树型结构显示的字段值。 |
type | 获取数据加载的类型。
该字段可选的值包括:
|
visible | 获取一个 Boolean 值,表示控件是否可见。如果该值为 true,则表示控件可见;反之则不可见。请使用 setVisible 方法设置该字段的值。 |
width | |
$body1 | |
$body2 | |
$bodyTable1 | |
$e | 获取该控件的占位符,该占位符为一个 JQuery 对象。 |
$grid | |
$head1 | |
$headTable1 | |
$view | |
$view1 | |
$view2 | |
_items | 受保护的。 |
名称 | 说明 |
oncelledited | 编辑后事件。 |
oncellediting | 编辑前事件。 |
ondeleted | |
ondeleting | 数据项删除前事件。 |
onexpanded | 数据项展开后事件。 |
onexpanding | 数据项展开前事件。 |
onitemcountchanged | 总记录数改变时触发该事件。 |
onitemdoubleclick | 当双击数据项列表中项的时候,将触发该事件。 |
onload | 数据加载事件。 |
onpageindexchanged | 当前的页面索引变更时触发该事件。调用 moveToPage 方法是触发该事件。 |
onselectionchanged | 当控件当前的选择项发生改变后,将触发该事件。通常调用 selectItem 、 deselectItem 、 deselectAll 等方法后会触发该事件。 |
onselectionchanging | 当控件当前的选择项发生改变的时候,将触发该事件。通常调用 selectItem 方法时会触发该事件。 |
JavaScript 代码 |
treeList.appendItem({
name: "C",
value: "c",
itemType: "folder",
items: [
{ name: "C1", value: "c1", itemType: "role" },
{ name: "C2", value: "c2", itemType: "role" }
]
}); |
JavaScript 代码 |
treeList.appendItems([
{
name: "C",
value: "c",
itemType: "folder",
items: [
{ name: "C1", value: "c1", itemType: "role" },
{ name: "C2", value: "c2", itemType: "role" }
]
},
{
name: "D",
value: "d",
itemType: "folder",
items: [
{ name: "D1", value: "d1", itemType: "role" },
{ name: "D2", value: "d2", itemType: "role" }
]
}
]); |
该字段的可选值包括:
该字段可选的值包括:
该字段可选的值包括: