我有这个树视图可以有可变数量的孩子（一些节点可以有多达3代的孩子，有些可能只有一个等）
我想要做的是在加载树视图时扩展某个节点。我有两个问题： 1）我找不到事件/回调，以便我知道树视图何时准备就绪 2）扩展功能并不总是有效（我会解释）
这是我的树视图：
function InitializeTreeview() {
var Children_Merchants = {
transport: {
read: {
url: function (options) {
return kendo.format(websiteRootUrl + '/Merchants/Merchants/?hasParents={0}', hasParent);
}
}
},
schema: {
model: {
model: {
id: "ID",
hasChildren: true,
children: Children_Merchants
}
}
}
};
var Brandowners = new kendo.data.HierarchicalDataSource({
transport: {
read: {
url: kendo.format(websiteRootUrl + '/Merchants/GetBrandowners?databaseID={0}', selectedDatabaseID)
}
},
//change: ExpandNode, - if I call expand node like this, it works.
schema: {
model: {
id: "ID",
hasChildren: true,
children: Children_Merchants
}
}
});
$('#treeview').kendoTreeView({
dataSource: Brandowners,
animation: {
collapse: {
duration: 200,
effects: "fadeOut"
},
expand: {
duration: 200,
effects: "fadeIn"
}
},
dataTextField: "Name",
complete: function () { alert('ok'); },
//dataBound : ExpandNode,
select: OnSelect,
expand: CheckIfHasParent
}).data('kendoTreeView');
}
function ExpandNode() {
var treeview;
treeview = $("#treeview").data("kendoTreeView");
var nodeToExpand = treeview.findByText('Adam'); //dummy txt, will have from parameter
treeview.expand(nodeToExpand);
}
数据绑定工作正常，我的控制器被调用，一切都很好。 所以我尝试将ExpandNode函数连接到单击按钮。函数被调用但没有任何反应。但是，如果我将它连接到父数据源的更改事件，它可以工作。另一个有趣的事情是select这样做，所以如果我用treeview.select（...）替换treeview.expand（...），它就适用于点击。
所以我的问题是：
1）我应该将什么事件用于loadEnd（或类似的smth） - 所以我不必将该函数绑定到按钮点击（它仍然可以，但我在加载结束时更喜欢） - P.S.我尝试了在kendo论坛上发现的所有内容，例如：change，requestEnd，success，dataBound，它们不起作用。对于有问题的节点，我尝试将属性“expanded”设置为TRUE的JSON发送，但是只修改箭头以显示它已打开，但它不会调用控制器并加载子节点。
2）您是否知道为什么ExpandNode仅在绑定到更改事件时才起作用？ - 对我来说最重要的问题。
3）如果您有建议，或者我在树视图的初始化中做错了什么，请告诉我。
答案 0 :(得分：3)
我已经使用一些免费解释复制了您的代码，答案是您的问题：
change事件的情况下运行。如果没有，那么代码中还有其他内容。CheckIfHasParent？ =＆gt; 我已将其实现为实际上什么都不做的功能。hasParent？ =＆gt; 我忽略了它。我写的代码：
$（document）.ready（function（）{ function InitializeTreeview（）{ var Children_Merchants = { 运输： { 读：function（op）{ var id = op.data.ID; var data = []; for（var i = 0; i＆lt; 10; i ++）{ var aux = id * 100 + i; data.push（{Name：＆＃34; Name - ＆＃34; + aux，ID：aux}）; } op.success（数据）; } }， 架构：{ 型号：{ 型号：{ id：＆＃34; ID＆＃34;， hasChildren：是的， 儿童：儿童_商人 } } } };
var Brandowners = new kendo.data.HierarchicalDataSource({
transport: {
read: function (op) {
op.success([
{"Name": "Adam", "ID": 1},
{"Name": "Benjamin", "ID": 2},
{"Name": "Caleb", "ID": 3},
{"Name": "Daniel", "ID": 4},
{"Name": "Ephraim", "ID": 5},
{"Name": "Frank", "ID": 6},
{"Name": "Gideon", "ID": 7}
])
}
},
//change: ExpandNode, - if I call expand node like this, it works.
schema : {
model: {
id : "ID",
hasChildren: true,
children : Children_Merchants
}
}
});
$('#treeview').kendoTreeView({
dataSource : Brandowners,
animation : {
collapse: {
duration: 200,
effects : "fadeOut"
},
expand : {
duration: 200,
effects : "fadeIn"
}
},
dataTextField: "Name",
dataBound : ExpandNode,
expand : CheckIfHasParent
}).data('kendoTreeView');
}
function ExpandNode() {
var treeview;
treeview = $("#treeview").data("kendoTreeView");
var nodeToExpand = treeview.findByText('Adam'); //dummy txt, will have from parameter
treeview.expand(nodeToExpand);
}
function CheckIfHasParent(e) {
}
InitializeTreeview();
});
你可以在这里玩它：http://jsfiddle.net/OnaBai/dSt2h/
答案 1 :(得分：1)
对于任何可能感兴趣的人：
function ExpandNode() {
var treeview;
var node1;
treeview = $("#treeview").data("kendoTreeView");
var node2;
var myURL = kendo.format(websiteRootUrl + '/Merchants/GetPathForSelectedNode?databaseID={0}&merchantID={1}&brandownerID={2}', selectedDatabaseID,MerID,BowID);
node1 = treeview.dataSource.get(BowID);
node = treeview.findByUid(node1.uid);
var uid = node1.uid;
node.find('span:first-child').trigger('click'); //expand 1st level
$.ajax( {
url: myURL,
dataType: "json",
contentType: 'application/json; charset=utf-8',
success: function(result)
{
var length = result.length;
var lastVal = 1;
for (var i = 1; i < length-1; i++) {
$("#treeview li[data-uid=\'" + uid + "\'] ul.k-group").waitUntilExists (function
() {
i = lastVal; // have to reinitialize i because waitUntilExist's callback will find the i incermented, over the needed value
lastVal++;
node2 = node1.children.get(result[i]);
node = treeview.findByUid(node2.uid);
uid = node2.uid;
node1 = node2;
if(lastVal <= length-1)
node.find('span:first-child').trigger('click'); // keep expanding
else
{
treeview.select(node); // just select last node
currentSelectedNode = node;
}
});
}
if(length == 2) //select 1st child
{
$("#treeview li[data-uid=\'" + uid + "\'] ul.k-group").waitUntilExists (function
() {
node2 = node1.children.get(result[i]);
node = treeview.findByUid(node2.uid);
uid = node2.uid;
node1 = node2;
treeview.select(node); // just select last node
currentSelectedNode = node;
});
}
}
});
}
这是我的方法。 for循环从1开始，因为我的数组中的第一个元素是第一个节点ID - 我已经扩展了。 .waitUntilExists是Ryan Lester的方法（我在上面的评论中放了一个链接）。非常感谢我的同事，OnaBai和Ryan Lester。我希望这可以帮助别人。干杯
答案 2 :(得分：1)
$("#treeview").kendoTreeView({
animation: {
expand: true
},
dataSource: dataSource,
dataBound: function (e) {
var tv = $("#treeview").data("kendoTreeView");
if (tv != null) {
tv.expand(".k-item");
}
},
dataTextField: "test",
dataValueField: "id"
});
答案 3 :(得分：0)
ypu可以通过以下代码轻松找到树视图已准备好扩展，扩展所有树视图节点，您也可以通过检查特定的id或文本找到它 hopw，以下示例将帮助您
例如：
$("#treeview").kendoTreeView({
animation: {
expand: true
},
dataSource: dataSource,
dataBound: function (e) {
var tv = $("#treeview").data("kendoTreeView");
if (tv != null) {
tv.expand(".k-item");
}
},
dataTextField: "test",
dataValueField: "id"
});