WebTreeView CustomStyle

8 replies. Last post: January 17, 2011 12:55 PM by Handy Surya
Tags :
Frank BruceMember

Can I custom the node's style,like this:when I onmouseover,the node color is red,when I onmouseout ,the node color is blue.(see the picture below)
Any way, my code does not work.

How can I do ??Anyone can help me ?Thanks 

 <ISWebTreeView:WebTreeView ID="Tree_left" runat="server" Height="365px" Width="156px"                    DataSourceID="XmlDataSource1" AutoGenerateDataBindings="True"          OnInitializeNode="Tree_left_InitializeNode">

  protected void Tree_left_InitializeNode(object sender, WebTreeViewNodeEventArgs e)
    {       
        if (e.Node.Depth == 2)
        {
            //e.Node.CustomStyle = "cursor: hand;border-bottom:1px solid #0000CC;vertical-align:bottom;color:#0000CC;";
            e.Node.Text ="<u onmouseover=\"this.style.color='red'\" onmouseout=\"this.style.color='#0000CC'\" >"+e.Node.Text+" </u>";
          
        }
    }
1 attachment

All Replies

Hello Frank you can set NodeStyle for Normal and Over properties. 

E.g In normal state, please try to apply below style.

 <NodeStyle>
 <Normal ForeColor="Blue">
 </Normal>
 <Over ForeColor="Red">
 </Over>
 </NodeStyle>

Regards,
Handy

I am sorry,your idea can not meet my need. I want to chang the current node(e.Node.Depth == 2)when I mousemove(not all the nodes).(see the picture)
can you help me???

1 attachment

Hello Frank,

I am afraid, it is not possible. Your workaround is raised an issue according to your screenshot.
The problem is, text is also applied into table element.
I suggest you to do it via client side by using attachevent for the current node.

Regards,
Handy

Can you show me a demo about how to custom style by clientside???
However,it does not work by the code below:
function WebTreeView1_OnNodeSelect(ctrlId, node) {
    var url = node.Value;
//    alert(node.style)
      node.style.color='red';
    if (url != "") {
        setPanelURL(url);       
    }
    return true;
}

Hello Frank,

It is not possible to change its color in properties. You will need to get the element and set its style.

function WebTreeView1_OnNodeSelect(ctrlId, node) {
    var url = node.Value;
    node.GetElement().style.color="red";
    if (url != "") {
        setPanelURL(url);        
    }
    return true;
}

 


Regards,
Handy

thank you,Handy

Can I set the style of the selected node?(the other nodes keep the default style)

Hello,

I think it is easier if you configure it in Node Style properties. Selected node would be referred into Active style.

Regards,
Handy 

All times are GMT -5. The time now is 3:38 AM.
Previous Next