RadTreeView Accessibility

[Alan]

I have a RadTreeView which has parent nodes which can be expanded to show its child nodes. These child nodes should then be able to be selected using checkboxes, but the parent nodes shouldn't. My issue is an accessibility one, as I wish to have the checkboxes associated with their text through a label, but the RadTreeView uses a <span> tag. The child nodes are populated when the parent node is expanded via the RadTreeView1_NodeExpand() method.

I believe the issue revolves around the parent/child situation as when creating a RadTreeView previously with no child nodes and a DataBind() I was able to declare a <NodeTemplate> which used checkboxes/labels, however this template does not seem to be used when adding the nodes via code behind using the Add() method with parents and children.

Is there a way I can add child nodes that adhere to a template I specify?

Here is my code, I have attached screenshots as well showing the association errors via WAVE.

No parent/children aspx:
<telerik:RadTreeView ID="RadTreeView1" runat="server" Skin="Skin_Telerik"
            CheckBoxes="false" MultipleSelect="true" SingleExpandPath="False"
            DataTextField="IDWithTitle" EnableEmbeddedSkins="false" DataFieldID="CategoryID"
            DataValueField="CategoryID" OnClientNodeClicked="ClientNodeClicked" Style="font-size:medium; white-space: normal;">
            <NodeTemplate>
                <asp:CheckBox runat="server" id="chkCategory" CssClass="rtChk" 
            Text='<%# String.Format("{0}: {1}", DataBinder.Eval(Container.DataItem, "CategoryID"), DataBinder.Eval(Container.DataItem, "Title")) %>' />
                <asp:HiddenField runat="server" ID="categoryID" Value='<%#DataBinder.Eval(Container.DataItem, "CategoryID")%>' />
            </NodeTemplate>
</telerik:RadTreeView>

No parent/children VB:
    RadTreeView1.DataSource = oList
    RadTreeView1.DataBind()


Parent/children aspx: 
<telerik:radtreeview id="RadTreeView1" AccessKey="M" TabIndex="1" runat="server" skin="Skin_Telerik" checkboxes="true"
                    multipleselect="true" singleexpandpath="False" datatextfield="Title" da enableembeddedskins="false"  
                    datafieldid="ID" datafieldparentid="ParentId" datavaluefield="ID" onclientnodeclicked="ClientNodeClicked" 
                    onnodeexpand="RadTreeView1_NodeExpand" Style="white-space: normal;" CheckChildNodes="true" Font-Size="Medium"/>

Parent/children VB:


Any help would be much appreciated!

Alan

[Alan]

Parent/children VB:     
     oNode = new RadTreeNode()

     oNode.Value = [ID]
     oNode.Text = [Title]
     oNode.Checkable = [Checkable]

     e.Node.Nodes.Add(oNode)

[Nencho]

Hello Alan,

I am not quite sure that I had fully understand the encountered issue. Could you specify if the issue is that you are unable to add child nodes programmatically (from code-behind) or the template in not applied on those items? As I can see the referenced code snippet for programmatically adding of the child nodes - you set them as checkable,  while you use the Template of the nodes for this purpose.

In addition, once a node is added to the collection, you should call the DataBind() on it, so that the template could be correctly applied. In addition, the items should have the same structure as the evaluated items from the datasource for the proper visualization of the node.

Regards,
Nencho
Telerik

 

 

[Alan]

Hi Nencho

Thanks for your reply. The issue I'm having is that I'm not able to apply a template when adding nodes programmatically in code-behind. This template needs to show a checkbox with its text as a label to satisfy usability standards (the checkboxes = true attribute just uses a span tag which is not satisfactory).

I'm currently looking at implementing ITemplate and that allows me to apply a template to nodes added programmatically through code-behind, however I am unable to set unique attributes for each node. Is this the route I should be taking? Would you be able to help me to set the attributes for each node?

Here is the link I've used: http://www.telerik.com/help/aspnet-ajax/panelbar-add-templates-runtime.html

Many thanks

Alan

[Nencho]

Hello Alan,

The approach you intended to follow is the correct one. You can dynamically instantiate the template of the Nodes as demonstrated in the help article below (I am not quite sure, why you had referenced the PanelBar Templates article):

http://www.telerik.com/help/aspnet-ajax/treeview-templates-runtime.html

In addition, you can handle the DataBiinding event of the controls, instantiated in the template and access the Node which is currently bound. You can use the node to add the needed attributes.

Regards,
Nencho
Telerik