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:
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.
After I added one, I added a second that would navigate to another page. My final tree view control looks like this:
I hope this helps someone out because it's not documented anywhere.
Cheers!
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!