オンデマンドでデータをロードする場合 (たとえば、AJAX 呼び出しを介して)、問題は、次の行が実行されたときに2 番目のノード (最初の子の最初の子)が存在しないことです。
$("#treeview").data("kendoTreeView").expand("li:fist li:first")
これを実現するには、最初の expand() の実行が終了した直後にその行を実行する必要があります。
2 つのオプションが表示されます。
kendoTreeのイベントを利用して
setTimeout を使用する (醜い方法)
広告 1。
var yourTreeSelector = "#youTreeId";
var $tree = $(yourTreeSelector);
var treeView = $tree.data("kendoTreeView");
var $firstItem = $tree.find(' > ul > li.k-item:first');
console.log($firstItem);
//make sure selector is ok and first item exists
if($firstItem.length){
treeView.expand($firstItem); //expand first item
var secondSelectedFlag = false; //init flag to false
//handler method
selectSecond = function(){
var $fistChildOfFirstItem = $firstItem.find(' > ul > li.k-item:first');
console.log($fistChildOfFirstItem);
//make sure expand will execute only when node exists and was not expanded earlier
if(!secondSelectedFlag && $fistChildOfFirstItem.length){
secondSelectedFlag = true;
treeView.expand($fistChildOfFirstItem);//expand on selected node
treeView.unbind("dataBound");//unbind method
}
}
treeView.bind("dataBound", selectSecond);//bind a handler method to dataBound event
}
広告 2. 最初のノードを展開した後、次のコードを配置します。
setTimeout(
function (){
var $fistChildOfFirstItem = $firstItem.find(' > ul > li.k-item:first');
console.log($fistChildOfFirstItem);
treeView.expand($fistChildOfFirstItem);
},
3000 //3 seconds is reasonable amount of time
);