[Solved] Treeview in PanelBar

[Donna Stewart]

I am trying to use a treeview within a panel bar and I'm having some issues.  I think mainly it is with adding the Content using Visual Basic lambda expressions.  I have finally gotten a little further in that I can see the treeview code within the panelbar code in the rendered html in Firebug, but it is not showing on the screen.  And I'm getting "Microsoft JScript runtime error: Object doesn't support this property or method " in IE in the jquery-1.4.4.js at line 32 col 228 - which is this line of code - s.insertBefore(v,s.firstChild);. If anyone can please give me any advice, I would really appreciate it! Here is the snippet from the rendered html that proves it is rendering the treeview within the panelbar:

    <ul class="t-widget t-panelbar t-reset" id="UsersAndUserGroups"><li class="t-item t-state-default"><a class="t-link t-header" href="#UsersAndUserGroups-1">Users<span class="t-icon t-arrow-down t-panelbar-expand"></span></a><div class="t-content" id="UsersAndUserGroups-1" style="display:none"><div class="t-widget t-treeview t-reset" id="Users" style="font-size:1em; height:550px;"><ul class="t-group t-treeview-lines"><li class="t-item t-first"><div class="t-top"><span class="t-icon t-plus"></span><span class="t-checkbox"><input class="t-input" name="Users_checkedNodes.Index" type="hidden" value="0" /><
'
'
'           Removed for brevity and security
'
'
<input class="t-input" name="itemValue" type="hidden" value="45" /></div></li></ul></div><script type="text/javascript">
    jQuery('#Users').tTreeView({showCheckBox:true, ajax:{"selectUrl":"/User/GetGroupsForUser"}, onExpand:updateUserTreeViewState, onCollapse:updateUserTreeViewState, onSelect:loginWebsiteAsUser, onLoad:onUserTreeViewLoad, onDataBound:onUserTreeViewLoad});
</script></div></li></ul><script type="text/javascript">
    jQuery('#UsersAndUserGroups').tPanelBar({expandMode:1});
</script>

And here is the code from the view for the PanelBar and TreeView:

<%  Html.Telerik().PanelBar.Name("UsersAndUserGroups") _
        .Items(Function(pitem) pitem.Add().Text("Users") _
        .Content(Sub()
            %><%= Html.Telerik().TreeView().Name("Users").ShowCheckBox(True).HtmlAttributes(New With {.style = "font-size:1em; height:550px;"}) _
                                    .ClientEvents(Function(evt) evt.OnSelect("loginWebsiteAsUser")) _
                                    .ClientEvents(Function(evt) evt.OnLoad("onUserTreeViewLoad")) _
                                    .ClientEvents(Function(evt) evt.OnDataBound("onUserTreeViewLoad")) _
                                    .ClientEvents(Function(evt) evt.OnCollapse("updateUserTreeViewState")) _
                                    .ClientEvents(Function(evt) evt.OnExpand("updateUserTreeViewState")) _
                                    .BindTo(CType(Model.userList, IEnumerable(Of UserClass)),
                                         Sub(mappings)
                                             mappings.For(Of UserClass)(
                                             Sub(binding)
                                                 binding _
                                                     .ItemDataBound(
                                                         Sub(item, usr)
                                                             Dim isExpanded As Boolean = DirectCast(ViewData("UserExpandedNodes"), String()).Contains(usr.userKey)
                                                             If isExpanded Then
                                                                 item.Text = "<span class='expanded'></span>" + usr.userDisplayName
                                                             Else
                                                                 item.Text = usr.userDisplayName
                                                             End If
                                                             item.Value = usr.userKey
                                                             item.LoadOnDemand = True
                                                             item.Encoded = False
                                                         End Sub)
                                             End Sub)
                                         End Sub) _
                                    .DataBinding(Function(dataBinding) dataBinding.Ajax().Select("GetGroupsForUser", "User"))%><%
           End Sub)) _
       .Render()
%>

Thank you,
Donna

[Hristo Germanov]

Hi Donna Stewart,

Thank you for contacting us.

I examined the attached code snippet and i noticed that you need to add .Render() to the TreeView component.

If this does not help I would ask you to provide a sample application which we can test locally.

Best wishes,
Hristo Germanov
the Telerik team

[Donna Stewart]

I got this to work.  It was a dumb mistake - I forgot to add telerik.panelbar.min.js to the Html.Telerik.ScriptRegistrar() in the Site.Master.  When I added it, everything worked.  I didn't need the .Render() for the treeview because I had used <%=, however I did remove that and use .Render().  Thank you for your response, though!

Donna