This is a migrated thread and some comments may be shown as answers.

Html.ActionLinks in TreeView Template

1 Answer 113 Views
TreeView
This is a migrated thread and some comments may be shown as answers.
Coy
Top achievements
Rank 1
Coy asked on 14 Apr 2014, 11:19 PM
Hey guys,

I have a solution for adding Html.ActionLink to the Template of a TreeView control.  I searched everywhere for something similar and I was unable to find it, so I'm going to post it here in hopes that it might help others in the same predicament.

I am using the razor pages for my implementation so I, for the most part, setup my TreeView control exactly like the Remote Data Binding demo found here: http://demos.telerik.com/kendo-ui/web/treeview/remote-data.html 

My Tree View control looks like this:

<div>
       @(Html.Kendo().TreeView()
        .Name("treeview")
        .DataTextField("DisplayValue")
        .DataSource(dataSource => dataSource
            .Read(read => read
                .Action("CategoryTree", "Category")
                )
            )
        )
 </div>

In my case, I wanted to add a couple of Action Links to the end of each item, in this categories.  The purpose of the action link was to navigate to a screen to allow the user to edit the items in the category tree.  I searched everywhere but could not find a way to do this.  I even came across a few posts stating that this was not possible.

I chose to use .Template() to add the action links.

Here's what I added to my tree to add an action link.

.Template("#: item.DisplayValue #  " + @Html.ActionLink("Update", "Update", new { id = "newId" })
.ToHtmlString().Replace("newId", "#: item.id #"))


After I added one, I added a second that would navigate to another page.  My final tree view control looks like this:

<div style="padding-top: 10px;">
 
    @(Html.Kendo().TreeView()
        .Name("treeview")
        .DataTextField("DisplayValue")
        .DataSource(dataSource => dataSource
            .Read(read => read
                .Action("CategoryTree", "Category")
                )
            )
            .Template("#: item.DisplayValue #  " + @Html.ActionLink("Update", "Update", new { id = "newId" })
            .ToHtmlString().Replace("newId", "#: item.id #") + " | " + @Html.ActionLink("Deactivate", "Deactivate", new { id = "newId" })
            .ToHtmlString().Replace("newId", "#: item.id #"))
        )
</div>


I hope this helps someone out because it's not documented anywhere.

Cheers!

1 Answer, 1 is accepted

Sort by
0
Rich
Top achievements
Rank 1
answered on 24 Jul 2017, 10:05 PM
Thanks a bunch. Just what I was looking for
Tags
TreeView
Asked by
Coy
Top achievements
Rank 1
Answers by
Rich
Top achievements
Rank 1
Share this question
or