6.1 kendo treeview functionality (wihtout + - to colllaps ex - Sitefinity - Front- & Back-End Development

All Replies

Posted by Community Admin on 21-Aug-2013 00:00

After trying kendo panelbar support told me to switch back to treeview.

But I am strugeling with the widget template.

a) of course I don't want all nodes expandes so I commented this line out

// kendoTreeView.expand(kendoTreeView.element.find(".k-item"));

b) of course once a page is selected I want the node for this pages expanded. This code thanks to Telerik does the trick.

var selectedNodesToExpand = kendoTreeView.element.find("li:has(li a.sfSel)");

kendoTreeView.expand(selectedNodesToExpand);

This link shows it: http://ceramdis.ch.mserver4.arvixevps.com/einsatzgebiete/sintertechnik

c) The client does not want an open (+) close (-) image to expand/collaps the trees. So this is what I need.

Look at his page: http://ceramdis.ch.mserver4.arvixevps.com/einsatzgebiete

This is a group page and it will redirect to the first 'real' page 'Ubersicht' and therefore expand the sibling nodes since the script from b) comes into actions

Problem

Look at this page: http://ceramdis.ch.mserver4.arvixevps.com/ihre-anforderungen

This is a real page. So when the user clicks 'Ihre Anforderungen' from the 1st Level in the navigation, the page is loaded and b) kicks in.

but -> I now want of course the child nodes expanded as well.

THE IDEA BEHIND IT

The first level pages are an overview for what is to come under that menu item.

The way that works:

Einsatzgebiete is an group page
Ubersicht is a real page and shown in Navigation

The way that does not work:
Ihre Anforderung is real page
No child nodes will be shown when page is loaded

Einsatzgebiet is a group page
Uebersicht is real page but not shown in navigation.

Long problem short.

I guess I need a jquery way to find the selected node and if it has child items expand them.

Markus

Posted by Community Admin on 23-Aug-2013 00:00

Hello,

For the betterment of the community I am going to post the solution we found in your support ticket here.

<script type="text/javascript">

(function($)

varkendoTreeView = $('.sfNavTreeview').not('div.k-treeview .sfNavTreeview').kendoTreeView(

animation: false

).data('kendoTreeView');

// to expand all nodes uncomment next line

// kendoTreeView.expand(kendoTreeView.element.find(".k-item"));

// to expand selected node uncomment next line

kendoTreeView.expand(kendoTreeView.element.find(".sfSel"));

)(jQuery);

</script>

Regards,
Patrick Dunn
Telerik

Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items

Posted by Community Admin on 23-Aug-2013 00:00

Dear Patrick

Thank's. I did post it in my panelbar first time user thread but forgot about this.

If you now add it to the template for 6.2 then nobody has to look here :-)

Once again thanks for the easy, obvious solution.

Markus

This thread is closed