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

[Solved] Treeviews nested in Grid with ClientTemplate almost working

1 Answer 142 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.
Bill
Top achievements
Rank 1
Bill asked on 01 Dec 2011, 01:12 AM
version 2011.3.1115, .NET 4.0, MVC3, EF4.1, VS2010, DB First with Repository Pattern

Telerik Guys,

I'm able to display treeviews in a grid using the clientTemplate, but I need some help to know what is the best approach to setting the binding and mapping properly.  My main concerns are that I don't know how to bind to a hierachal model because the model would need to be different for each treeview instance, depending on the row it is in.  The other issue I have is using client expressions to create a unique name and to pass a variable to my controller.

I initially started with 2 nested grids using the clientTemplate and I achieved what I needed because my data will only have two levels of hierachy. By the way, your nested grids are awesome.  But the Treeview would be more visually appealing, especially since I can't remove the grid headers.  So I removed the two nested grids and replaced with a treeview.  Using the Load On Demand method of databinding, I'm able to see nice treeviews in my grid.  Its visually very nice.  But my binding is not correct and here is why.  Look at my Client Template below.

.DetailView(details => details.ClientTemplate(
    
Html.Telerik().TreeView()
    
.Name("Constraints_<#= u2UserRoleId #>")
    .DataBinding(dataBinding =>  dataBinding.Ajax()
        
.Enabled(true)
        .Select("_ConstraintsForTreeViewAjax", "u2UserRole"
            
new {Id = 
"5DEF309F-0AF5-E011-9CB4-0016356D24F9" }))// "<#= u2UserRoleId #>"
        
.ToHtmlString()
))

When I try to use client side expression like <#= u2UserRole #>, it doesnt resolve and instead emits <%23%3d%20u2UserRoleId%20%23>.  So in my example, I hard code a known u2UserRoleId which gets passed to my controller method below.

public JsonResult _ConstraintsForTreeViewAjax(System.Guid Id)
{
    var model = u2constraintRepository.All
        .Select(s => new 
        {
            Text = s.u2ConstraintValue.u2ConstraintType.ConstraintTypeName + ": " + s.u2ConstraintValue.ConstraintText1,
            Value = s.u2ConstraintId,
            LoadOnDemand = true, //HasChildren(s.u2ConstraintId), - this wont work cuz Linq to Entities doesnt understand this func
            Enabled = true
            u2UserRoleId = s.u2UserRoleId,
            ParentConstraintId = s.ParentConstraintId,
        })
        .Where(s => (s.u2UserRoleId.Equals(Id) && s.ParentConstraintId == null) || s.ParentConstraintId.Value.Equals(Id))
        .OrderBy(s => s.Text)
        ;
    return Json(model, JsonRequestBehavior.AllowGet);
}

This anonymous type actually works because the treeview is able to translate the first 4 properties.  The last two are used for filtering and ordering server side.  The Where clause is written in a way so that I can use this function for getting the first level of the hierachy (the relationship between the grid data and this data) and also the children data(node relationships).

So the BIG problem I have with this implementaion is that I can't properly set the Route Value in my clientTemplate.  Even if the client expressions worked, it would need to be different for the 1st level of the hierarchy and the children because only the first level is directly related to the grid's data.  My child nodes would need something like <#= u2constraintId #>.  I'm hoping maybe there is a javascript way of referencing the correct values to pass to the controller.  If not, what do you recommend?  Do you think I can use a partial view in the clientTemplate so that I can use the Treeview data model binding the way it is documented? 

I've only been doing MVC and Telerik for about a month so please forgive my noobness.  I've attached a pic of the grid and treeview versions of my View.   Thanks in advance :-)

Just for information, my table structure is like the following.
Grid table: u2UserRole                      TreeView Table: u2constraint
        PK Guid    u2UserRoleId                PK Guid    u2constraintId
        FK Guid    u2UserId                       FK Guid     u2UserRoleId (relates to the Grid's table)
        FK Guid    u2RoleId                       FK Guid     u2ConstaintValueId
                                                              FK Guid     ParentConstraintId  (nullable, self-referencing, may contain a u2ConstraintId)



 

1 Answer, 1 is accepted

Sort by
0
Georgi Tunev
Telerik team
answered on 05 Dec 2011, 12:42 PM
Hi Bill,

 The scenario that you describe is quite complex and I'm afraid that at this point we cannot say why your approach is not working as expected. Could you please send a sample project that reproduces your exact setup and the logic that you currently using? This will give us a better view over your case and we will do our best to help you right away. There is no need to send us your real database - a dummy datasource will be sufficient.


Best wishes,
Georgi Tunev
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
Tags
TreeView
Asked by
Bill
Top achievements
Rank 1
Answers by
Georgi Tunev
Telerik team
Share this question
or