Forums Ultimate UI for ASP.NET Web Forms
Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
Close
Ricardo Calvo
1810
WebDataTree + Templates + Chrome: Looks different
posted

Hi,

I am trying to use a simple template with a checkbox for some nodes in a WebDataTree added  programmatically.

The solution seems to work but it looks slightly different when viewed with Chrome, the problem is an img tag (with no image) that appears on the left of the node but in Chrome the text is below that image.

I attach a print screen for you to see the problem and the source code of the template (just in case I am doing something wrong)

Thank you in advance.

WebDataTreeTemplate.zip
Parents
No Data
Reply
  • 12679
    posted

    Hello rickycl,

    Thank your for posting in the community! I’ve taken a look at your code and I was wondering if you need only checkboxes to put in the template, why don’t you stick with the built-in feature of the control?  I’ve just commented the template and turn on the checkbox feature of the tree with the code below:

    1. <html xmlns="http://www.w3.org/1999/xhtml">
    2. <head runat="server">
    3.     <title></title>
    4. </head>
    5. <body>
    6.     <form id="form1" runat="server">
    7.     <div>
    8.         <asp:ScriptManager ID="ScriptManager1"
    9.                 runat="server">
    10.         </asp:ScriptManager>
    11.         <asp:Button ID="btnAddNode" runat="server" Text="Add Node" OnClick="btnAddNode_Click" />
    12.         <asp:TextBox ID="txtNodeText" runat="server" ToolTip="Node's text"></asp:TextBox>
    13.         <ig:WebDataTree
    14.                 ID="WebDataTree1"
    15.                 runat="server"
    16.                 Height="300px"
    17.                 Width="200px"
    18.                 CheckBoxMode="BiState">
    19.         </ig:WebDataTree>
    20.     </div>
    21.     </form>
    22. </body>
    23. </html>

    Here is the code – behind after the modifications:

    1. public partial class _Default : System.Web.UI.Page
    2. {
    3.     protected void Page_Load(object sender, EventArgs e)
    4.     {
    5.  
    6.     }
    7.     protected override void OnPreInit(EventArgs e)
    8.     {
    9.         base.OnPreInit(e);
    10.         LoadTemplate();
    11.     }
    12.     protected void btnAddNode_Click(object sender, EventArgs e)
    13.     {
    14.         var lNode = WebDataTree1.Nodes.Add(txtNodeText.Text);
    15.        // lNode.TemplateId = "checknode";
    16.     }
    17.  
    18.     private void LoadTemplate()
    19.     {
    20.         //Infragistics.Web.UI.ItemTemplate lTemplate = new Infragistics.Web.UI.ItemTemplate();
    21.         //lTemplate.Template = new checkNodeTemplate();
    22.         //lTemplate.TemplateID = "checknode";
    23.         ////WebDataTree1.Templates.Add(lTemplate);
    24.     }
    25.  
    26.     public class checkNodeTemplate : ITemplate
    27.     {
    28.  
    29.         public void InstantiateIn(Control container)
    30.         {
    31.             var lcont = (Infragistics.Web.UI.TemplateContainer)container;
    32.             var lNode = (Infragistics.Web.UI.NavigationControls.DataTreeNode)lcont.Item;
    33.             var lCheckBox = new CheckBox();
    34.             lCheckBox.Text = lNode.Text;
    35.             lCheckBox.Style.Add(HtmlTextWriterStyle.PaddingBottom, "10px");
    36.             container.Controls.Add(lCheckBox);
    37.         }
    38.     }
    39. }

     Here is the outlook:

     

     

Children