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

Templates when binding to a hierarchical model

5 Answers 130 Views
TreeView
This is a migrated thread and some comments may be shown as answers.
This question is locked. New answers and comments are not allowed.
Scott
Top achievements
Rank 1
Scott asked on 30 Apr 2012, 10:02 PM
I'm looking for an example of how to use a template when binding to a hierarchical model.  I'm able to sucessfully bind a treeview using the binding to model example shown in the demos however I can't seem to figure out how to use a template like what is shown in the templates example.  Are there any good examples out there on how to accomplish this?

5 Answers, 1 is accepted

Sort by
0
raphael
Top achievements
Rank 1
answered on 03 May 2012, 07:55 AM
Hi scott,

I don't know if this is what you are looking for. I used my treeview to show my menu elements:

here you have my simplified model.

public class MenuModel
   {
       public int MenuId { get; set; }
       public int? ParentId { get; set; }
       public string Name { get; set; }
       public List<MenuModel> Children { get; set; }
   }

on my controller I just send back to the view my menu graph with his children element

Root
        Child level 1
               Child level 2
                    ...... child level n

in my view I simply bind the treeview like that

    @(Html.Telerik().TreeView()
        .Name("TreeView")
        .BindTo(Model, mappings =>
        {
            mappings.For<MenuModel>(binding => binding
                    .ItemDataBound((item, menu) =>
                    {
                        item.Text = menu.Name;
                        item.Value = menu.MenuId.ToString();
                        item.Expanded = true;
                    })
                    .Children(m => m.Children));
        })
)

in this way I got the entire  hierarchical model in my treeview.

Hope this help you.

Raphael
0
Daniel
Telerik team
answered on 03 May 2012, 03:16 PM
Hi,

In order to use a template for the item you should set an action which to render the HTML to the TreeViewItem Content property. For example:
Html.Telerik().TreeView()
        .Name("TreeView")
        .BindTo(Model, mappings =>
        {
            mappings.For<Category>(binding => binding
                    .ItemDataBound((item, category) =>
                    {
                        item.Text = category.CategoryName;
                        item.Content = () => { Html.RenderPartial("ItemTemplate", category); };
                    });
                     
        }).Render();


Kind regards,
Daniel
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the Telerik Extensions for ASP.MET MVC, subscribe to their blog feed now.
0
Scott
Top achievements
Rank 1
answered on 03 May 2012, 05:32 PM
I actually ended up getting what I wanted by using a string of HTML for the text and setting the encoding to false like the following.
@{Html.Telerik().TreeView()
        .Name("MyTreeView")
        .BindTo(Model.ItemCollection, mappings =>
        {
            mappings.For<MyHierarchicalModel>(binding => binding
                    .ItemDataBound((item, myItem) =>
                    {
                        item.Text = string.Format("<strong>{0}</strong>", myItem.Description);
                        item.Encoded = false;
                        item.Value = myItem.ItemId.ToString();
                        item.ImageUrl = myItem.IconUrl;
                        item.Expanded = true;
                    })
                    .Children(myItemChild => myItemChild.ItemCollection));
        }).Render();
}

My hierarcchical model has a child item collection like raphael's so would that solution account for that as well?  Also does it make a call to the server to load the partial view for each item?
0
Accepted
Daniel
Telerik team
answered on 07 May 2012, 01:34 PM
Hi Scott,

If the item has children then you should use your current approach. Using the Content to set the template will override any children.
Regarding your other question - a request is not made when using the Content property. The template is generated by calling the Action that writes the HTML.


Regards,
Daniel
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the Telerik Extensions for ASP.MET MVC, subscribe to their blog feed now.
0
Scott
Top achievements
Rank 1
answered on 07 May 2012, 05:28 PM
Good to know, thanks.
Tags
TreeView
Asked by
Scott
Top achievements
Rank 1
Answers by
raphael
Top achievements
Rank 1
Daniel
Telerik team
Scott
Top achievements
Rank 1
Share this question
or