Hi All,
I am using Telerik Radtreeview, some of its node has checkbox enabled & image. Also i have used css to set the width of highligh to 100%. But the highlight & node width increses for the nodes which has checkbox & image than other nodes. Please let me know how we can keep width & highlight constant & within the Treeview Width.
Attaching image which shows actual issue also below is the code used.
This is very urgent issue for us so immediate response will be highly appreciated.
Thanks
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<
html
xmlns
=
"http://www.w3.org/1999/xhtml"
>
<
head
runat
=
"server"
>
<
title
></
title
>
<
telerik:RadStyleSheetManager
id
=
"RadStyleSheetManager1"
runat
=
"server"
/>
<
style
>
.RadTreeView .rtIn {
display:inline-block !important;
white-space:normal !important;
width:100% !important;
}
.RadTreeView .rtTop
{
white-space: nowrap !important;
}
</
style
>
</
head
>
<
body
>
<
form
id
=
"form1"
runat
=
"server"
>
<
telerik:RadScriptManager
ID
=
"RadScriptManager1"
runat
=
"server"
>
<
Scripts
>
<%--Needed for JavaScript IntelliSense in VS2010--%>
<%--For VS2008 replace RadScriptManager with ScriptManager--%>
<
asp:ScriptReference
Assembly
=
"Telerik.Web.UI"
Name
=
"Telerik.Web.UI.Common.Core.js"
/>
<
asp:ScriptReference
Assembly
=
"Telerik.Web.UI"
Name
=
"Telerik.Web.UI.Common.jQuery.js"
/>
<
asp:ScriptReference
Assembly
=
"Telerik.Web.UI"
Name
=
"Telerik.Web.UI.Common.jQueryInclude.js"
/>
</
Scripts
>
</
telerik:RadScriptManager
>
<
script
type
=
"text/javascript"
>
//Put your JavaScript code here.
</
script
>
<
telerik:RadAjaxManager
ID
=
"RadAjaxManager1"
runat
=
"server"
>
</
telerik:RadAjaxManager
>
<
div
>
<
telerik:RadTreeView
ID
=
"RadTreeView2"
runat
=
"server"
Skin
=
"Windows7"
CheckBoxes
=
"true"
>
</
telerik:RadTreeView
>
<
telerik:RadTreeView
ID
=
"RadTreeView1"
runat
=
"server"
Skin
=
"Windows7"
CheckBoxes
=
"true"
>
<
Nodes
>
<
telerik:RadTreeNode
runat
=
"server"
Text
=
"Parent"
ImageUrl
=
"Dependency.GIF"
>
<
Nodes
>
<
telerik:RadTreeNode
runat
=
"server"
Text
=
"Child0"
></
telerik:RadTreeNode
>
</
Nodes
>
</
telerik:RadTreeNode
>
</
Nodes
>
</
telerik:RadTreeView
>
</
div
>
</
form
>
</
body
>
</
html
>
using
System;
using
System.Web;
using
System.Web.UI;
using
System.Web.UI.WebControls;
using
System.Data;
using
System.Configuration;
using
System.Web.Security;
using
System.Web.UI.WebControls.WebParts;
using
System.Web.UI.HtmlControls;
using
Telerik.Web.UI;
public
partial
class
Default : System.Web.UI.Page
{
protected
void
Page_Load(
object
sender, EventArgs e)
{
if
(!Page.IsPostBack)
{
RadTreeNode node =
new
RadTreeNode(
"Parent"
);
RadTreeView2.Nodes.Add(node);
node.ExpandMode = TreeNodeExpandMode.ServerSide;
node.ImageUrl = @
"Dependency.GIF"
;
}
RadTreeView2.NodeExpand +=
new
RadTreeViewEventHandler(RadTreeView2_NodeExpand);
}
void
RadTreeView2_NodeExpand(
object
sender, RadTreeNodeEventArgs e)
{
RadTreeNode node =
new
RadTreeNode(
"Childe"
+ e.Node.Level);
node.Checkable =
false
;
e.Node.Nodes.Add(node);
e.Node.Expanded =
true
;
}
protected
override
void
OnInit(EventArgs e)
{
RadTreeView2.NodeTemplate =
new
LabelTemplate();
base
.OnInit(e);
}
}
class
LabelTemplate : ITemplate
{
/// <summary>
/// Instantiate In Container
/// </summary>
/// <param name="container"></param>
public
void
InstantiateIn(Control container)
{
string
textToBind =
string
.Empty;
if
(container
is
RadTreeNode)
{
textToBind = ((RadTreeNode)container).Text;
}
Label label1 =
new
Label();
label1.Text = textToBind;
container.Controls.Add(label1);
}
}