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

[Solved] Parent node with no visible child nodes

1 Answer 233 Views
TreeView
This is a migrated thread and some comments may be shown as answers.
Troy Young
Top achievements
Rank 1
Troy Young asked on 05 Feb 2010, 04:54 AM
I am creating a treeview dynamically in Page_Init and loading it using the LoadXmlString() method with the xml below.  In the XML, the leaf-nodes are set to Visible=False.  When the treeview renders, the parent nodes are still displaying the expand icon, even though there is technically nothing to expand since the children are not visible.  Clicking on the expand icon still performs an expand, but it only displays a single line of whitespace where the child nodes would be if they were visible   Since the child nodes are not visible, I would have expected those parent nodes to be rendered like leaf nodes, with no expand/collapse images.  What is the expected behavior here?  How can I have the tree render so that the expand/collapse images do not render for any node that has no visible children?


<Tree CheckBoxes="True" CssClass="fldVal" Width="250px" style="position:absolute;left:150px;top:800px;height:146px;" fldRevID="207" fldName="TestFolders">
    <Node Text="Root" Value="198" Category="AppFolder" Visible="True" Enabled="True" Tooltip="" ImageURL="images/folder.gif" Checkable="False" sngSel="False">
        <
Node Text="Folder1" Value="196" Category="AppFolder" Visible="True" Enabled="True" Tooltip="" ImageURL="images/folder.gif" Checkable="False" sngSel="False">
            <
Node Text="Program1a" Value="" Category="AppProgram" Checked="False" Tooltip="" ImageURL="images/program.gif" Visible="False" prgPfx="" />
            <
Node Text="Program1b" Value="" Category="AppProgram" Checked="False" Tooltip="" ImageURL="images/program.gif" Visible="False" prgPfx="" />
            <Node Text="Program1c" Value="" Category="AppProgram" Checked="False" Tooltip="" ImageURL="images/program.gif" Visible="False" prgPfx="" />
        </
Node>
        <Node Text="Folder2" Value="197" Category="AppFolder" Visible="True" Enabled="True" Tooltip="" ImageURL="images/folder.gif" Checkable="False" sngSel="False">
            <Node Text="Program2a" Value="" Category="AppProgram" Checked="False" Tooltip="" ImageURL="images/program.gif" Visible="False" prgPfx="" />
            <
Node Text="Program2b" Value="" Category="AppProgram" Checked="False" Tooltip="" ImageURL="images/program.gif" Visible="False" prgPfx="" />
            <Node Text="Program2c" Value="" Category="AppProgram" Checked="False" Tooltip="" ImageURL="images/program.gif" Visible="False" prgPfx="" /><
        /
Node>
    </Node>
</
Tree

1 Answer, 1 is accepted

Sort by
0
Yana
Telerik team
answered on 05 Feb 2010, 01:43 PM
Hi Troy,

The treeview doesn't know how many child nodes will be hidden, it shows Plus/Minus sign when there're any nodes (visible and invisible) by default. You can change this by setting ContentCssClass property of the nodes that have only hidden children like this:

<Tree CheckBoxes="True" CssClass="fldVal" Width="250px" style="position:absolute;left:150px;top:800px;height:146px;" fldRevID="207" fldName="TestFolders">
  <Node Text="Root" Value="198" Category="AppFolder" Visible="True" Enabled="True" Tooltip="" ImageURL="images/folder.gif" Checkable="False" sngSel="False">
    <Node Text="Folder1" Value="196" Category="AppFolder" Visible="True" Enabled="True" Tooltip="" ImageURL="images/folder.gif" Checkable="False" sngSel="False" ContentCssClass="noChilds">
      <Node Text="Program1a" Value="" Category="AppProgram" Checked="False" Tooltip="" ImageURL="images/program.gif" Visible="False" prgPfx="" />
      <Node Text="Program1b" Value="" Category="AppProgram" Checked="False" Tooltip="" ImageURL="images/program.gif" Visible="False" prgPfx="" />
      <Node Text="Program1c" Value="" Category="AppProgram" Checked="False" Tooltip="" ImageURL="images/program.gif" Visible="False" prgPfx="" />
    </Node>
    <Node Text="Folder2" Value="197" Category="AppFolder" Visible="True" Enabled="True" Tooltip="" ImageURL="images/folder.gif" Checkable="False" sngSel="False" ContentCssClass="noChilds">
      <Node Text="Program2a" Value="" Category="AppProgram" Checked="False" Tooltip="" ImageURL="images/program.gif" Visible="False" prgPfx="" />
      <Node Text="Program2b" Value="" Category="AppProgram" Checked="False" Tooltip="" ImageURL="images/program.gif" Visible="False" prgPfx="" />
      <Node Text="Program2c" Value="" Category="AppProgram" Checked="False" Tooltip="" ImageURL="images/program.gif" Visible="False" prgPfx="" />
    </Node>
  </Node>
</Tree>

and the noChilds css class:

<style type="text/css">
    div.noChilds .rtPlus, div.noChilds .rtMinus {
        background-image: none;
    }
</style>

Best wishes,
Yana
the Telerik team

Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
Follow the status of features or bugs in PITS and vote for them to affect their priority.
Tags
TreeView
Asked by
Troy Young
Top achievements
Rank 1
Answers by
Yana
Telerik team
Share this question
or