Dorado 9 : 操作树节点(sample-center)

本例提供了树节点的各种常用操作：

有针对当前树的遍历，查询和定位
树节点的增加和删除
树节点的移动

遍历说明

树遍历范例代码：

function dosomething(nodes) {
	nodes.each(function(node) {
		dosomething(node.get("nodes"));
	});
}

dosomething(view.get("#treeGrid.nodes"));

遍历代码应用技巧一(展开所有节点)：

function expand(nodes) {
	nodes.each(function(node) {
		if (!node.get("expanded")) node.expand();
		expand(node.get("nodes"));
	});
}

expand(view.get("#treeGrid.nodes"));

遍历代码应用技巧二(收缩所有节点)：

function collapse(nodes) {
	nodes.each(function(node) {
		collapse(node.get("nodes"));
		if (node.get("expanded")) node.collapse();
	});
}
collapse(view.get("#treeGrid.nodes"));

遍历代码应用技巧三(全部选中):

function select(nodes) {
	nodes.each(function(node) {
		select(node.get("nodes"));
		node.set("checked", true);
	});
}

select(view.get("#treeGrid.nodes"));

遍历代码应用技巧四(全部取消选中):

function unselect(nodes) {
	nodes.each(function(node) {
		unselect(node.get("nodes"));
		node.set("checked", false);
	});
}

unselect(view.get("#treeGrid.nodes"));

遍历代码应用技巧五(获得所有选中节点):

var nodes = view.get("#treeGrid").getCheckedNodes(), message;
if (nodes && nodes.length) {
	var names = [];
	nodes.each(function(data){
		names.push(data.get("data.firstName"));
	});
	message = names.join("\n");
}
else {
	message = "未选中任何节点！";
}
dorado.MessageBox.alert(message);

添加删除节点

在Dorado中新增或删除树节点不再需要调用很复杂的Tree相关的api,一般情况下我们只要针对实体对象操作就可以，如删除节点(remove方法)：

var currentEntity = view.get("#treeGrid.currentEntity");
currentEntity.remove();

添加节点(createChild方法)：

var currentNode = view.get("#treeGrid.currentNode");
var currentEntity = currentNode.get("data");
currentNode.expandAsync(function() {
	currentEntity.createChild("underlings", {
		firstName: "First Name",
		lastName: "Last Name"
	});
});

其中underlings是立体数据模型相对currentEntity中的一个子属性，如下图：

上面代码的意思就是给Employee的underlings添加一个子对象。

默认添加的子对象的位置如下(Steven添加子对象后，子对象处于所有子对象的最后一个位置)

如果希望对插入节点进行相对位置设定，例如希望插入节点处于第一个位置，则可以在insert方法中添加"begin"参数：

var currentNode = view.get("#treeGrid.currentNode");
var currentEntity = currentNode.get("data");
currentNode.expandAsync(function() {
	currentEntity.get("underlings").insert({
		firstName: "First Name",
		lastName: "Last Name"
	}, "begin");
});

那么新增节点的位置效果就如下图：

添加同级节点(用createBrother方法)：

var currentNode = view.get("#treeGrid.currentNode");
var currentEntity = currentNode.get("data");
currentEntity.createBrother({
	firstName: "First Name",
	lastName: "Last Name"
});

如果选择Steven，再用createBrother方法添加节点的效果如图：

也可以指定位置插入节点，如在当前节点的前面插入同级节点：

var currentNode = view.get("#treeGrid.currentNode");
var currentEntity = currentNode.get("data");
currentEntity.parent.insert({
	firstName: "<First Name>",
	lastName: "<Last Name>",
}, "before", currentEntity);

这儿采用了before参数，并提供了refEntity相对参照实体对象，这样新增的实体对象就添加到Steven的上面。

关于insert的详细说明，可以参考client-api,截图：

insert方法还可以进行树的节点移动，参考下面的内容

树的节点移动

另外也可以很方便的实现树的节点移动，如下的Anne节点

我们希望将Anne节点移动到Robert的上面，效果如下：

那么我们就可以通过如下代码实现：

var currentEntity = view.get("#treeGrid.currentNode.data");
var previous = currentEntity.getPrevious();
currentEntity.parent.insert(currentEntity, "before", previous);

同样也支持向下的节点移动，如下Anne再移动到Robert下面：

实现代码：

var currentEntity = view.get("#treeGrid.currentNode.data");
var next = currentEntity.getNext();
currentEntity.parent.insert(currentEntity, "after", next);

上面的几个范例都是节点间平级的移动，如果希望在树的不同级别实现移动，如Anne移到与Steven相同级别的位置：

实现代码为：

var currentNode = view.get("#treeGrid.currentNode");
var currentEntity = currentNode.get("data");
var parentEntity = currentNode.get("parent.data");
parentEntity.parent.insert(currentEntity, "after", parentEntity);

Dorado 9 : 操作树节点(sample-center)

遍历说明

添加删除节点

树的节点移动

Attachments: