Icons problem

[Martin]

I have set up a treeview / grid combo and I am trying to set a folder icon for each node. Basically I am aiming for the Outlook 2010 look, but just can't recreate it even with the example.

My folders appear underneath the +/- symbols and the tree structure goes crazy and is no longer neatly nested but more like stepped.

What have I done wrong?

Thanks

<telerik:RadSplitter ID="rdSplitter" runat="server" Height="800px"
    Width="623px" BorderSize="1" BorderStyle="None" Skin="Windows7">
    <telerik:RadPane ID="rdTreeViewPane" runat="server" Height="500px" Width="295px">
        <telerik:RadTreeView ID="rdTreeView" Runat="server"
            onnodeclick="rdTreeView_NodeClick" Width="100%" Height="100%" Skin="Windows7">
        </telerik:RadTreeView>
    </telerik:RadPane>

    <telerik:RadSplitBar ID="RadSplitBar1" runat="server" />

    <telerik:RadPane ID="rdGridViewPane" runat="server" Width="330px">
        <telerik:RadGrid ID="rdViewDocuments" runat="server" GridLines="None"
            Width="99.5%" AllowPaging="True" Skin="Windows7" PageSize="20">
            <MasterTableView AutoGenerateColumns="False" DataKeyNames="DocumentID">
            <RowIndicatorColumn>
                <HeaderStyle Width="20px"></HeaderStyle>
            </RowIndicatorColumn>
            <ExpandCollapseColumn>
                <HeaderStyle Width="20px"></HeaderStyle>
            </ExpandCollapseColumn>
                <Columns>
                    <telerik:GridImageColumn DataImageUrlFields="FileType" DataImageUrlFormatString="~/images/icons/{0}.png"
                        ImageHeight="12px" ImageWidth="12px" UniqueName="column6" AllowFiltering="False"
                        AllowSorting="False" DataAlternateTextField="FileType">
                        <ItemStyle Width="22px" Height="22px" VerticalAlign="Middle" HorizontalAlign="Center" />
                    </telerik:GridImageColumn>

                    <telerik:GridTemplateColumn DataField="Title" HeaderText="Title" UniqueName="column3">
                        <ItemTemplate>
                            <asp:HyperLink runat="server" ID="DownloadLink" NavigateUrl='<%# DataBinder.Eval(Container, "DataItem.FilePath", "{0}") %>'
                                Text='<%# DataBinder.Eval(Container, "DataItem.Title") %>' Target="_blank"></asp:HyperLink>

                            <telerik:RadToolTip ID="rdTitleToolTip" runat="server" TargetControlID="DownloadLink"
                                Width="200" RelativeTo="Element" Position="MiddleLeft">
                                <strong>
                                    <%# DataBinder.Eval(Container, "DataItem.Title") %></strong><br />
                                <%# DataBinder.Eval(Container, "DataItem.Summary")%>
                            </telerik:RadToolTip>
                        </ItemTemplate>
                        <ItemStyle VerticalAlign="Top" HorizontalAlign="Left" />
                    </telerik:GridTemplateColumn>

                    <telerik:GridBoundColumn DataField="FileSize" HeaderText="Size" UniqueName="column4"
                        AllowFiltering="False" AllowSorting="False">
                        <HeaderStyle HorizontalAlign="Center" />
                        <ItemStyle VerticalAlign="Top" HorizontalAlign="Center" />
                    </telerik:GridBoundColumn>

                    <telerik:GridDateTimeColumn DataField="LastUpdated" DataFormatString="{0:dd/MM/yyyy}"
                        HeaderText="Last Updated" UniqueName="column5" AllowFiltering="False">
                        <HeaderStyle HorizontalAlign="Center" />
                        <ItemStyle VerticalAlign="Top" HorizontalAlign="Center" />
                    </telerik:GridDateTimeColumn>
                </Columns>
            </MasterTableView>
            <PagerStyle AlwaysVisible="True" Mode="NumericPages" />
            <HeaderContextMenu EnableAutoScroll="True"></HeaderContextMenu>
        </telerik:RadGrid>
    </telerik:RadPane>
</telerik:RadSplitter>

string imageURL = "images/icons/mailfolder.gif";

private void GetTree()

{

    PDUser U = PDUser.GetCurrentUser();

    List<Folder> FolderList = Folder.GetFolders(U.SchemeID, 0, 0);

 

    foreach (Folder F in FolderList)

    {

        //Create parent

        RadTreeNode NewNode = new RadTreeNode();

        NewNode.ImageUrl = imageURL;

        NewNode.Text = F.FolderName + "<span style='font-style:italic; font-size:10px;'> (" + F.DocumentCount.ToString() + " files)</span>";

        NewNode.ToolTip = F.FolderName;

        NewNode.Value = F.FolderID.ToString();

 

        //Create children

        GetChild(U.SchemeID, U.UserID, F.FolderID, ref NewNode);

 

        rdTreeView.Nodes.Add(NewNode);

    }

}

 

private void GetChild(int SchemeID, int UserID, int FolderID, ref RadTreeNode NewNode)

{

    List<Folder> FolderList = Folder.GetFolders(SchemeID, 0, FolderID);

    foreach (Folder F in FolderList)

    {

        RadTreeNode ChildNode = new RadTreeNode(F.FolderName);

        GetChild(SchemeID, UserID, F.FolderID, ref ChildNode);

        ChildNode.ImageUrl = imageURL;

        ChildNode.Text = F.FolderName + "<span style='font-style:italic; font-size:10px;'> (" + F.DocumentCount.ToString() + " files)</span>";

        ChildNode.ToolTip = F.FolderName;

        ChildNode.Value = F.FolderID.ToString();

        NewNode.Nodes.Add(ChildNode);

    }

}

 

//Populate GridView with available documents

protected void rdTreeView_NodeClick(object sender, RadTreeNodeEventArgs e)

{

    PDUser U = PDUser.GetCurrentUser();

 

    string folderStr = e.Node.Value;

    int folderID = Convert.ToInt32(folderStr);

    List<Document> DocumentList = Document.GetDocuments(U.UserID, folderID);

 

    rdViewDocuments.DataSource = DocumentList;

    rdViewDocuments.DataBind();

    rdViewDocuments.Visible = true;

}

[Kate]

Hello Martin,

Since your scenario is a customized one and the issue can not easily be reproduced given the code that you provided I would suggest that you open a support ticket and send us a sample runnable project. Thus we can inspect it locally and come back to you with a suitable solution.

Kind regards,
Kate
the Telerik team