blocks|key|615448|text|如果要单击id在data中的项的所有祖先，请添加以下代码行：|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|615449|var+ancestors+=+$(node).parents("li[role='treeitem']");
$(">div>span>input",+ancestors).click();|code-block|syntax|javascript|615450|这将为每个节点选择当前节点an的所有祖先clicks+input。|615451|因此，您的代码应该如下所示：|615452|++data.forEach(function+(entry)+{
++++++var+treeView+=+$("#treeview").data('kendoTreeView');
++++++var+dataSource+=+treeView.dataSource;
++++++var+dataItem+=+dataSource.get(entry);
++++++var+node+=+treeView.findByUid(dataItem.uid);
++++++var+checkbox+=+$("input[type='checkbox']",+node)[0];
++++++checkbox.click();
++++++var+ancestors+=+$(node).parents("li[role='treeitem']");
++++++$(">div>span>input",+ancestors).click();
++});|615453|您可以看到它在这里运行：http://dojo.telerik.com/@OnaBai/IRom|615454|entityMap|0|LINK|mutability|MUTABLE|url|http://dojo.telerik.com/@OnaBai/IRom^0|5|2|8|4|0|0|K|6|R|5|0|0|0|C|10|0|0^^$0|@$1|2|3|4|5|6|7|10|8|@$9|11|A|12|B|C]|$9|13|A|14|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|15|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|16|8|@$9|17|A|18|B|C]|$9|19|A|1A|B|C]]|D|@]|E|$]]|$1|M|3|N|5|6|7|1B|8|@]|D|@]|E|$]]|$1|O|3|P|5|H|7|1C|8|@]|D|@]|E|$I|J]]|$1|Q|3|R|5|6|7|1D|8|@]|D|@$9|1E|A|1F|1|1G]]|E|$]]|$1|S|3|-4|5|6|7|1H|8|@]|D|@]|E|$]]]|T|$U|$5|V|W|X|E|$Y|Z]]]]

If you want to click all ancestors of items which <code>id</code> are in <code>data</code>, add the following lines of code:

<pre><code>var ancestors = $(node).parents("li[role='treeitem']");
$("&gt;div&gt;span&gt;input", ancestors).click();
</code></pre>

This selects all ancestors of current node an for each of them <code>clicks</code> the <code>input</code>.

So your code should look like:

<pre><code> data.forEach(function (entry) {
 var treeView = $("#treeview").data('kendoTreeView');
 var dataSource = treeView.dataSource;
 var dataItem = dataSource.get(entry);
 var node = treeView.findByUid(dataItem.uid);
 var checkbox = $("input[type='checkbox']", node)[0];
 checkbox.click();
 var ancestors = $(node).parents("li[role='treeitem']");
 $("&gt;div&gt;span&gt;input", ancestors).click();
 });
</code></pre>

You can see it running here: <a href="http://dojo.telerik.com/@OnaBai/IRom" rel="nofollow">http://dojo.telerik.com/@OnaBai/IRom</a>

blocks|key|522246|text|找到了更好的方法，先生|type|unstyled|depth|inlineStyleRanges|entityRanges|data|522247|success:+function+(data)+{
++++++++$.each(data,+function+(index,+entry)+{

++++++++++++++++++++++++var+dataSource+=+treeView.dataSource;
++++++++++++++++++++++++var+dataItem+=+dataSource.get(entry);

++++++++++++++++++++++++if+(!dataItem.hasChildren)
++++++++++++++++++++++++{
++++++++++++++++++++++++++++dataItem.set("checked",+true);
++++++++++++++++++++++++}
++++++++++++++++++++++++var+node+=+treeView.findByUid(dataItem.uid);

++++++++++++++++++++++++parents.push(treeView.dataItem(treeView.parent(node)).id);

++++++++++++++++++++++++if+(index+%2B+1+==+data.length)+{
++++++++++++++++++++++++++++setTimeout(function+()+{
++++++++++++++++++++++++++++++++self.expandParents(parents,+treeView);
++++++++++++++++++++++++++++},+100);
++++++++++++++++++++++++}+++++++++++++++++++++++++
++++++++++++++++++++});
++++++++++++++++++++setTimeout(function+()+{
++++++++++++++++++++++++self.filterChange(treeView,+data);
++++++++++++++++++++},+100);
++++++++++++++++}|code-block|syntax|javascript|522248|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

found a better approach sir @OnaBai

<pre><code>success: function (data) {
 $.each(data, function (index, entry) {

 var dataSource = treeView.dataSource;
 var dataItem = dataSource.get(entry);

 if (!dataItem.hasChildren)
 {
 dataItem.set("checked", true);
 }
 var node = treeView.findByUid(dataItem.uid);

 parents.push(treeView.dataItem(treeView.parent(node)).id);

 if (index + 1 == data.length) {
 setTimeout(function () {
 self.expandParents(parents, treeView);
 }, 100);
 } 
 });
 setTimeout(function () {
 self.filterChange(treeView, data);
 }, 100);
 }
</code></pre>

blocks|key|615475|text|我想出的最好的解决办法是：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|615476|突出显示的代码：|615477|dataBound:+function(e){
++++//+expands+tree+to+the+selected+node
++++var+root+=+e.node+?+$(e.node)+:+this.element;
++++//+expands+only+selected+checkboxes+and+parents+
++++this.expand(root.find(".k-item+input[type=checkbox]:checked").parents());
},|code-block|syntax|javascript|615478|完整代码：|615479|$(".locationTree").kendoTreeView({
++++loadOnDemand:+false,
++++checkboxes:+true,
++++select:+function(e){
++++++++e.preventDefault();
++++},
++++dataSource:+{
++++++++type:+"json",
++++++++data:+processTable(flatData,+"id",+"parent",+0)
++++},
++++dataBound:+function(e){
++++++++//+expands+tree+to+the+selected+node
++++++++var+root+=+e.node+?+$(e.node)+:+this.element;
++++++++//this.expand(root.find(".k-item"));+//+expands+all
++++++++//+expands+only+selected+checkboxes+and+parents+
++++++++this.expand(root.find(".k-item+input[type=checkbox]:checked").parents());
++++},
});|615480|entityMap^0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|P|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|Q|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|6|7|R|8|@]|9|@]|A|$]]|$1|K|3|L|5|F|7|S|8|@]|9|@]|A|$G|H]]|$1|M|3|-4|5|6|7|T|8|@]|9|@]|A|$]]]|N|$]]

The best solution I came up with was this:

Highlighted code:

<pre><code>dataBound: function(e){
 // expands tree to the selected node
 var root = e.node ? $(e.node) : this.element;
 // expands only selected checkboxes and parents 
 this.expand(root.find(".k-item input[type=checkbox]:checked").parents());
},
</code></pre>

Full code:

<pre><code>$(".locationTree").kendoTreeView({
 loadOnDemand: false,
 checkboxes: true,
 select: function(e){
 e.preventDefault();
 },
 dataSource: {
 type: "json",
 data: processTable(flatData, "id", "parent", 0)
 },
 dataBound: function(e){
 // expands tree to the selected node
 var root = e.node ? $(e.node) : this.element;
 //this.expand(root.find(".k-item")); // expands all
 // expands only selected checkboxes and parents 
 this.expand(root.find(".k-item input[type=checkbox]:checked").parents());
 },
});
</code></pre>

hi there kendo enthusiast.. i have a little problem on kendo treeview, i manage to expand the selected child node of a treeview if it is a parent, but i can expand it's grand parents, here is my little code:

<pre><code>data.forEach(function (entry) {
 var treeView = $("#sysfunc_ktreeview").data('kendoTreeView');
 var dataSource = treeView.dataSource;
 var dataItem = dataSource.get(entry);
 var node = treeView.findByUid(dataItem.uid);
 var checkbox = $("input[type='checkbox']", node)[0];
 checkbox.click();
 });
</code></pre>

in this case i am getting the array from a database. but here, i cant expand the parent nodes if there child nodes were checked but there id(the parent) where not in the array. any great help will be much appreciated. this little piece of code is from sir OnaBai.. thanks sir

how to expand the parent nodes of a selected child node on kendo treeview

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋 

腾讯云代码助手

CODING DevOps

Cloud Studio

SDK中心

API中心

命令行工具

嗨，剑道爱好者。在kendo treeview上我遇到了一个小问题，如果树视图是父节点，我可以扩展它的选定子节点，但是我可以展开它的大父节点，下面是我的小代码：data.forEach(function (entry) {                        var treeView = $("#sysfun...

问如何在kendo treeview上展开选定子节点的父节点
EN

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在kendo treeview上展开选定子节点的父节点EN