C# .NET - Treeview - Asked By kshama parashar on 30-Aug-11 02:03 AM

Hello To All

I have a c#.net web application in which i want to create a treeview.
It possible to create a treeview like attached Image in C#.net...




Help Me....................
Ravi S replied to kshama parashar on 30-Aug-11 02:11 AM
HI

try this

using System;
using System.Drawing;
using System.Collections;
using System.ComponentModel;
using System.Windows.Forms;
using System.Data;
 
namespace TreeViewExample
{
  /// <summary>
  /// Summary description for TreeViewExample.
  /// </summary>
  public class TreeViewExample : System.Windows.Forms.Form
  {
    internal System.Windows.Forms.TreeView treeFood;
    /// <summary>
    /// Required designer variable.
    /// </summary>
    private System.ComponentModel.Container components = null;
 
    public TreeViewExample()
    {
      //
      // Required for Windows Form Designer support
      //
      InitializeComponent();
 
      //
      // TODO: Add any constructor code after InitializeComponent call
      //
    }
 
    /// <summary>
    /// Clean up any resources being used.
    /// </summary>
    protected override void Dispose( bool disposing )
    {
      if( disposing )
      {
        if (components != null)
        {
          components.Dispose();
        }
      }
      base.Dispose( disposing );
    }
 
    #region Windows Form Designer generated code
    /// <summary>
    /// Required method for Designer support - do not modify
    /// the contents of this method with the code editor.
    /// </summary>
    private void InitializeComponent()
    {
      this.treeFood = new System.Windows.Forms.TreeView();
      this.SuspendLayout();
      //
      // treeFood
      //
      this.treeFood.Anchor = (((System.Windows.Forms.AnchorStyles.Top | System.Windows.Forms.AnchorStyles.Bottom)
        | System.Windows.Forms.AnchorStyles.Left)
        | System.Windows.Forms.AnchorStyles.Right);
      this.treeFood.ImageIndex = -1;
      this.treeFood.Location = new System.Drawing.Point(4, 5);
      this.treeFood.Name = "treeFood";
      this.treeFood.SelectedImageIndex = -1;
      this.treeFood.Size = new System.Drawing.Size(284, 256);
      this.treeFood.TabIndex = 1;
      this.treeFood.AfterSelect += new System.Windows.Forms.TreeViewEventHandler(this.treeFood_AfterSelect);
      //
      // TreeViewExample
      //
      this.AutoScaleBaseSize = new System.Drawing.Size(5, 13);
      this.ClientSize = new System.Drawing.Size(292, 266);
      this.Controls.AddRange(new System.Windows.Forms.Control[] {
                                      this.treeFood});
      this.Name = "TreeViewExample";
      this.Text = "TreeView Example";
      this.Load += new System.EventHandler(this.TreeViewExample_Load);
      this.ResumeLayout(false);
 
    }
    #endregion
 
    /// <summary>
    /// The main entry point for the application.
    /// </summary>
    [STAThread]
    static void Main()
    {
      Application.Run(new TreeViewExample());
    }
 
    private void TreeViewExample_Load(object sender, System.EventArgs e)
    {
      TreeNode node;
       
      node = treeFood.Nodes.Add("Fruits");
      node.Nodes.Add("Apple");
      node.Nodes.Add("Peach");
       
      node = treeFood.Nodes.Add("Vegetables");
      node.Nodes.Add("Tomato");
      node.Nodes.Add("Eggplant");
    }
 
    private void treeFood_AfterSelect(object sender, System.Windows.Forms.TreeViewEventArgs e)
    {
      if (e.Action == TreeViewAction.ByMouse)
      {
        MessageBox.Show(e.Node.FullPath);
      }
    }
  }
}



refer
http://www.codeproject.com/KB/tree/dbTree.aspx
http://www.daniweb.com/software-development/csharp/threads/118395
Anoop S replied to kshama parashar on 30-Aug-11 02:23 AM
refer the code below


01.private void Form1_Load(object sender, EventArgs e)
02.{
03.  //Add Treeview Click Event....
04.  this.treeView1.Click += new System.EventHandler(this.treeView1_Click);
05.}
06. 
07. 
08.private void treeView1_Click(object sender, EventArgs e)
09.{
10.  int flag = 0;
11.  if(flag==0)
12.  {
13.  treeView1.ExpandAll();
14.  flag = 1;
15.  }
16.}


//See Below Images For More Idea :

 i) Normal Treeview...




 ii) When I Click on The Root Node It Will Expand All Nodes Automatically...

Anoop S replied to Anoop S on 30-Aug-11 02:27 AM
 i) Normal Treeview...



 ii) When I Click on The Root Node It Will Expand All Nodes Automatically

balaji mogadali replied to kshama parashar on 30-Aug-11 02:38 AM
Sreekumar P replied to kshama parashar on 30-Aug-11 05:21 AM
Hi,

http://plugins.jquery.com/files/horizontalTree.zip

http://plugins.jquery.com/project/horizontaltreehttp://plugins.jquery.com/project/horizontaltree

One more here.

http://frank-mich.com/jQuery/


All these are with Jquery/Javascript . You have to convert ur datasource to JSON or some other client Side datasoruce.

Feel Free to ping me for this if u want any help.

dipa ahuja replied to kshama parashar on 30-Aug-11 06:14 AM
you can create menu tree using the tree view control with sitemap datasource:

For static binding you can go to the property window and and set the property "Nodes": Fand set the  Text and the navigateurl property of each node For ex:

<asp:TreeView ID="TreeView1" runat="server">
<Nodes>
  <asp:TreeNode NavigateUrl="~/Default.aspx" Text="Home" Value="Home">
  <asp:TreeNode NavigateUrl="~/chat.aspx" Text="Page 2" Value="Page 2">
  </asp:TreeNode>
  </asp:TreeNode>
</Nodes>
</asp:TreeView>

Second way you can bind it using the sitemapDataSource :

Add new siteMap file in your file that is web.sitemap:

<?xml version="1.0" encoding="utf-8" ?>
<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0" >
  <siteMapNode url="Default.aspx" title="Home"  description="This is home page">
  <siteMapNode url="Default2.aspx" title="Child1"  description="Child1" />
  <siteMapNode url="Default3" title="Child2"  description="Chil2" />
  </siteMapNode>
</siteMap>
Now Add Tree Control + SiteMapDataSource and set the Datasource property of TreeView:

<asp:TreeView ID="TreeView2" runat="server" DataSourceID="SiteMapDataSource1">
</asp:TreeView>
<asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" />