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

setting background color

8 Answers 236 Views
TreeView
This is a migrated thread and some comments may be shown as answers.
Patxi
Top achievements
Rank 1
Patxi asked on 19 Mar 2009, 07:01 PM
Hello,

First of all, I am going to write an example of a treeview to explain better myself.

Node1
    | Node 1.1
           | Node 1.1.1
           | Node 1.1.2
Node 2
    | Node 2.1
Node 3
Node 4

I would like to set a background color ONLY to the root nodes which have leaves. In this case Node 1 and Node 2. IdonĀ“t want to set it for Node 1.1 despite it has leaves as well. Only root nodes with leaves.

Do you understand it? Please feel free to ask me in case of any doubt.

Thank you in advance.
   

8 Answers, 1 is accepted

Sort by
0
Accepted
Shinu
Top achievements
Rank 2
answered on 20 Mar 2009, 04:51 AM
Hello Patxi,

Try the following code snippet for setting the background color for root nodes that have children.

CS:
protected void RadTreeView1_PreRender(object sender, EventArgs e) 
    foreach (RadTreeNode node in RadTreeView1.Nodes) 
    { 
        if (node.Nodes.Count != 0) 
        { 
            node.BackColor = System.Drawing.Color.Pink; 
        } 
    } 

Thanks,
Shinu.
0
Patxi
Top achievements
Rank 1
answered on 20 Mar 2009, 08:42 AM
Wonderful Shinu!

Thank you so much.
0
mirang
Top achievements
Rank 1
answered on 20 Jan 2012, 11:32 AM
Any idea, how can I do it on the client side using javascript?
0
Princy
Top achievements
Rank 2
answered on 20 Jan 2012, 01:03 PM
Hello,

Try the following javascript.
JS:
function OnClientLoad(sender, args)
 {
    var nodes = sender.get_allNodes();
    for (var i = 0; i < nodes.length; i++)
       {
          if (nodes[i].get_level() == 0)
          {
             if (nodes[i]._hasChildren() == true)
              {
                   nodes[i].set_cssClass("parentCSS");
              }
           }
        }
 }

CSS:
<style type="text/css">
.parentCSS
  {
     color:Red !important;
  }
</style>

Thanks,
Princy.
0
mirang
Top achievements
Rank 1
answered on 20 Jan 2012, 01:33 PM
I am actually highlighting the entire tow of the node, not just the text or the tree node. The style which you provided worked with the text part. Do you have anything for the entire row of the node.
0
Bozhidar
Telerik team
answered on 20 Jan 2012, 05:03 PM
Hello Mirang,

Try the follwing CSS classes:
.RadTreeView_Default .rtTop:hover,
.RadTreeView_Default .rtMid:hover,
.RadTreeView_Default .rtBot:hover
{
    background-color: Red;
}

 
All the best,
Bozhidar
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 RadControls for ASP.NET AJAX, subscribe to their blog feed now
0
mirang
Top achievements
Rank 1
answered on 20 Jan 2012, 06:02 PM
this would apply by default, but i want to set this style at runtime from javascript for a particular node only. Can you redirect me to some links, that would  be very helpful.
0
Bozhidar
Telerik team
answered on 21 Jan 2012, 01:27 PM
Hello Mirang,

Once you have the client object of the node, you can do the following to set the class to the containing div element:
var element = node.get_element().childNodes[0];
$telerik.$(element).addClass('customClass');

 
Kind regards,
Bozhidar
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 RadControls for ASP.NET AJAX, subscribe to their blog feed now
Tags
TreeView
Asked by
Patxi
Top achievements
Rank 1
Answers by
Shinu
Top achievements
Rank 2
Patxi
Top achievements
Rank 1
mirang
Top achievements
Rank 1
Princy
Top achievements
Rank 2
Bozhidar
Telerik team
Share this question
or