TreeView node style - for an individual node

[Homer J. Simpson]

Hi all,

I just went over a *lot* of tree node style properties (LeftNodeStyle,
NodeStyle, ParentNodeStyle, RootNodeStyle, LevelStyles, HoverNodeStyle,
SelectedNodeStyle, etc etc etc) but can't find exactly what I want.

It seems that I'm in a situation where none of these predefined groups fit
the bill. Ultimately, the style to use needs to be decided as I'm
dynamically adding individual nodes through code. I'd like to do this:

if( [some convoluted conditions] ) {
tnNewNode = new TreeNode( strCaption );
tnNewNode.[Something] = "bold";
tnParent.ChildNodes.Add( tnNewNode );
}

It's this [Something] property that I'm looking for--one that applies to an
individual node, but not necessarily others that happen to fall in some
common category.

I've managed to add separate styles for clickable nodes by using something
like:

..MyTreeClass a
{
(styles that apply to all clickable nodes, which all happen to have an
archor tag)
}

....but I need finer granularity. Thinking along the same way, I've hacked
together the following:

tnNewNode = new TreeNode( "<div class='clsTest'>" + strCaption + "</div>" );

and in my .css file:

..MyTreeClass .clsTest
{
font-weight: bold;
}

But this is *so* ugly I can't help but think there's just gotta be some
better way to do this than force my own div around the node's text.

 

[Brandon Gano]

I think the CssClass property is the [Something] you are looking for.

--code--
if (...) {
tnNewNode = new TreeNode(strCaption);
tnNewNode.CssClass = "BoldNode";
tnParent.ChildNodes.Add(tnNewNode);
}

--css--
..MyTreeClass .BoldNode {
font-weight:bold;
}

 

[Homer J. Simpson]

I think the CssClass property is the [Something] you are looking for.

--code--
if (...) {
tnNewNode = new TreeNode(strCaption);
tnNewNode.CssClass = "BoldNode";
tnParent.ChildNodes.Add(tnNewNode);
}

--css--
.MyTreeClass .BoldNode {
font-weight:bold;
}

I'm gonna have to try it regardless of that IntelliSense is telling me. It
definitely did *not* popup the .CssClass property (that's the first thing I
was looking for).

 

[Homer J. Simpson]

I think the CssClass property is the [Something] you are looking for.

I'm gonna have to try it regardless of that IntelliSense is telling me.
It definitely did *not* popup the .CssClass property (that's the first
thing I was looking for).

Nope, it doesn't look like .CssClass is a valid property for a TreeNode.
Looking at the raw HTML as received by the browser, each node already has
both an id and a class, so it's not entirely surprising that you can't
specify your own class to override it.

 

[Brandon Gano]

TreeView must have been one of the controls MS threw together at the last
minute. You're right; <asp:TreeNode /> provides no means of specifying
styles. It has no CssClass property and no skinning capabilities. I think
the best you can get without some serious work on the Render methods of
these controls is to style the nodes based on their heirarchical level. For
example:

--aspx--
<asp:TreeView CssClass="tree" ID="MyTree" runat="server">
<Nodes>
<asp:TreeNode Text="Red">
<asp:TreeNode Text="Green">
<asp:TreeNode Text="Blue" />
</asp:TreeNode>
</asp:TreeNode>
</Nodes>
</asp:TreeView>

--css--
.tree a { color:red; }
.tree div a { color:green; }
.tree div div a { color:blue; }

I think the CssClass property is the [Something] you are looking for.

--code--
if (...) {
tnNewNode = new TreeNode(strCaption);
tnNewNode.CssClass = "BoldNode";
tnParent.ChildNodes.Add(tnNewNode);
}

--css--
.MyTreeClass .BoldNode {
font-weight:bold;
}

I'm gonna have to try it regardless of that IntelliSense is telling me.
It definitely did *not* popup the .CssClass property (that's the first
thing I was looking for).

Nope, it doesn't look like .CssClass is a valid property for a TreeNode.
Looking at the raw HTML as received by the browser, each node already has
both an id and a class, so it's not entirely surprising that you can't
specify your own class to override it.

 

[Homer J. Simpson]

TreeView must have been one of the controls MS threw together at the last

minute. You're right; <asp:TreeNode /> provides no means of specifying
styles. It has no CssClass property and no skinning capabilities. I think
the best you can get without some serious work on the Render methods of
these controls is to style the nodes based on their heirarchical level.
For example:

--aspx--
<asp:TreeView CssClass="tree" ID="MyTree" runat="server">
<Nodes>
<asp:TreeNode Text="Red">
<asp:TreeNode Text="Green">
<asp:TreeNode Text="Blue" />
</asp:TreeNode>
</asp:TreeNode>
</Nodes>
</asp:TreeView>

--css--
.tree a { color:red; }
.tree div a { color:green; }
.tree div div a { color:blue; }

I was kinda leaning in that direction, but the problem is that the
conditions that drive the visual rendering in my case isn't easily
represented in CSS. I definitely cannot use the hierarchy level either.
The ideal would be for me to decide the class to use in code, and then
assign the class name to some (apparently missing) node property.