How to Bind a TreeView in Asp.Net?

In this example, I am showing you how to bind a treeview. Here, I am having a table in database where we store Modules and their sub-modules having parent-child like relationship.
Step-1: Add a TreeView to your .aspx Page.

    <asp:TreeView ID="ModuleTreeView" runat="server" ShowLines="true"

   PopulateNodesFromClient="false" BackColor="#99CCFF" style="width:100%"         

   ShowExpandCollapse="false">

    </asp:TreeView>

Step-2: Add a table named "Module" to your database which will store all modules and sub-modules.

Step-3: Insert some values into your table. 

All those modules which do not have any parent modules, their ParentModuleID is set to '0(Zero)'.

Step-4: Add these following code behind methods to the page.

SqlConnection con = new SqlConnection("----Your Connection String----");

    SqlCommand com;

    protected void Page_Load(object sender, EventArgs e)

    {

        ModuleTreeView.ExpandAll();

        FillTreeView();

    }

    //----- Get all the module details from database -----//

    public DataTable GetModuleDetails()

    {

        com = new SqlCommand("select ModuleID,ModuleName,ParentModuleID from Module", con);

        SqlDataAdapter da = new SqlDataAdapter(com);

        DataTable dt = new DataTable();

        da.Fill(dt);

        return dt;

    }

    //----Method to fill the treeview-----//

    public void FillTreeView()

    {

        DataTable Modules = new DataTable();

        Modules = GetModuleDetails();

        ModuleTreeView.Nodes.Clear();

        PopulateTreeNode(Modules, null, 0);

    }

    //----- Method to bind the treeview nodes as per the moduleID and ParentModuleID-----//

    private void PopulateTreeNode(DataTable ModuleList, TreeNode parent, int parentID)

    {

        TreeNodeCollection baseNodes;

        TreeNode node;

        if (parent == null)

        {

            baseNodes = ModuleTreeView.Nodes;

        }

        else

        {

            baseNodes = parent.ChildNodes;

        }

        foreach (DataRow dtRow in ModuleList.Rows)

        {

            if (int.Parse(dtRow["ParentModuleID"].ToString()) == parentID)

            {

                node = new TreeNode();

                node.Text = dtRow["ModuleName"].ToString();

                node.Value = dtRow["ModuleID"].ToString();

                node.SelectAction = TreeNodeSelectAction.Select;

                baseNodes.Add(node);

                PopulateTreeNode(ModuleList, node, int.Parse(dtRow["ModuleID"].ToString()));

            }

        }

        ModuleTreeView.ExpandAll();

    }

Now we are done and we can find the result by debugging the page.

The Final Output:

Regards,

Prajanuranjan....

How to add a TreeView inside a DropDownList in Asp.New

Step-1: Add a TextBox to your Page.

         <asp:TextBox ID="Module" runat="server"></asp:TextBox>

Step-2: Add a Panel and place a treeview inside it.

<asp:Panel ID="pnl" runat="server">

<asp:TreeView ID="ModuleTreeView" runat="server" ShowLines="true" PopulateNodesFromClient="false" BackColor="#99CCFF" style="width:100%" ShowExpandCollapse="false">

       </asp:TreeView>

</asp:Panel>

Step-3: Add a Ajax DropdownExtender and set its TargetControlID to the TextBox.

<asp:DropDownExtender ID="DropDownExtender1" runat="server" TargetControlID="Module"

            DropDownControlID="pnl">

</asp:DropDownExtender>

Step-4: Then write your own method to bind the treeview.

(I have described about binding a treeview in another blog- http://mydotnetcollections.blogspot.in/2012/07/how-to-bind-treeview-in-aspnet.html)

The final output is:

How to add Row Serial Number to Gridview Rows in Asp.Net

<ItemTemplate>           

     <asp:Label ID="LblSlNo" runat="server" Text="<%# Container.DataItemIndex + 1 %>"></asp:Label>

</ItemTemplate>

Regards,
Prajanuranjan...

How to create a Column Chart in Asp.Net?

Step-1: Create a table in your database.

Step-2: Insert your values into your table.

Step-3: Then add a chart control to your page.

<asp:Chart ID="Chart1" runat="server">

            <Series>

                <asp:Series Name="Series1">

                </asp:Series>

            </Series>

            <ChartAreas>

                <asp:ChartArea Name="ChartArea1" Area3DStyle-Enable3D="true" >

                </asp:ChartArea>

            </ChartAreas>

        </asp:Chart>

Step-4: Then add this code behind method to your page and call this method whenever you want to load your chart.

protected void Load_Chart()

{

        SqlConnection con = new SqlConnection("---Your Connection string---“);

        SqlCommand com;

        com = new SqlCommand("select ProjectTitle,ProgressPercentage from Project", con);

        DataTable dt = new DataTable();

        SqlDataAdapter da = new SqlDataAdapter(com);

        da.Fill(dt);

        Chart1.DataSource = dt;

        Chart1.DataBind();

        Chart1.Series[0].XValueMember = "ProjectTitle";

        Chart1.Series[0].YValueMembers = "ProgressPercentage";

        Chart1.Series[0].ToolTip = "#VAL";

        Chart1.ChartAreas[0].AxisX.Interval = 1;

 }

Step-5: The final output:

Output with showing tool tip:

How to create a Pie Chart in asp.net?

Here, we'll discuss about creating a pie chart in asp.net
Step-1: Create a table in your database.

Step-2: Insert your values into your table.

Step-3: Then add a chart control to your page.

<asp:Chart ID="Chart1" runat="server">

            <Series>

                <asp:Series Name="Series1" ChartType="Pie">

                </asp:Series>

            </Series>

            <ChartAreas>

                <asp:ChartArea Name="ChartArea1">

                </asp:ChartArea>

            </ChartAreas>

</asp:Chart>

Step-4: Then add this code behind method to your page and call this method whenever you want to load your chart.

protected void Load_Chart()

{

        SqlConnection con = new SqlConnection("------- Your connection string--------“);

        SqlCommand com;

        com = new SqlCommand("select ProjectTitle,ProgressPercentage from Project", con);

        DataTable dt = new DataTable();

        SqlDataAdapter da = new SqlDataAdapter(com);

        da.Fill(dt);

        Chart1.DataSource = dt;

        Chart1.DataBind();

        Chart1.Series[0].XValueMember = "ProjectTitle";

        Chart1.Series[0].YValueMembers = "ProgressPercentage";

        Chart1.Series[0].ToolTip = "Completed : " + "#PERCENT";//--Used to show tooltip

        Chart1.ChartAreas[0].Area3DStyle.Enable3D = true;

 }

Step-5: The final output:

Output with showing tool tip:

Regards,

Prajanuranjan....

How to insert multiple record into SQL Server database in a single time without using looping?

My Gridview(Source Code):

<asp:GridView ID="grdEducation" runat="server" AutoGenerateColumns="false" CssClass="gridview" ShowFooter="true">

            <Columns>

                <asp:TemplateField>

                    <HeaderTemplate>

                        Examination Passed

                    </HeaderTemplate>

                    <ItemTemplate>

                        <asp:TextBox ID="txtExamination" runat="server"></asp:TextBox>

                    </ItemTemplate>

                </asp:TemplateField>

                <asp:TemplateField>

                    <HeaderTemplate>

                        College/University

                    </HeaderTemplate>

                    <ItemTemplate>

                        <asp:TextBox ID="txtCollege" runat="server"></asp:TextBox>

                    </ItemTemplate>

                </asp:TemplateField>

                <asp:TemplateField>

                    <HeaderTemplate>

                        Total Mark

                    </HeaderTemplate>

                    <ItemTemplate>

                        <asp:TextBox ID="txtTotalMark" runat="server"></asp:TextBox>

                    </ItemTemplate>

                </asp:TemplateField>

                <asp:TemplateField>

                    <HeaderTemplate>

                        Marks Secured

                    </HeaderTemplate>

                    <ItemTemplate>

                        <asp:TextBox ID="txtMarksSecured" runat="server"></asp:TextBox>

                    </ItemTemplate>

                    <FooterTemplate><asp:Button ID="btnSave" runat="server" Text="Save" /></FooterTemplate>

                </asp:TemplateField>

            </Columns>

        </asp:GridView>

My Gridview(Design View):

Code Behind method to set the default view of the Gridview :

protected void Page_Load(object sender, EventArgs e)

    {

        if (!IsPostBack)

        {

            FillGrid();

        }

    }

    public void FillGrid()

    {

        DataTable table = new DataTable();

        DataRow row;

        DataView view;

        for (int i = 0; i < 4; i++)

        {

            row = table.NewRow();

            table.Rows.Add(row);

        }

        view = new DataView(table);

        grdEducation.DataSource = view;

        grdEducation.DataBind();

    }

My Table (Education_Details):

After that add a Type in your Database.

    CREATE TYPE Educations

    AS TABLE

    (

         Education_Name varchar(50),

         College_Name varchar(50),

         Total_Mark decimal(18,2),

         Marks_Secured decimal(18,2)

    )

Then create a stored procedure

CREATE PROCEDURE InsertEducationDetails

(

@Education as Educations READONLY

/* "Educations" is the Type you have created earlier */

/* "@Education" is a type of "Educations" like we are using int,varchar etc*/

)

AS

BEGIN

INSERT INTO Education_Details

(

       Education_Name,College_Name,Total_Mark,Marks_Secured

)

SELECT Education_Name,College_Name,Total_Mark,Marks_Secured FROM @Education;

END

Now write this code behind method in your page and add this as a delegate for the button present inside the gridview.

protected void SaveButton_Click(object sender, EventArgs e)

    {

        DataTable dtEducation = new DataTable();

        DataColumn dcExam = new DataColumn("Exam_Name", typeof(string));

        DataColumn dcCollege = new DataColumn("College_Name", typeof(string));

        DataColumn dcTotalMark = new DataColumn("Total_Mark", typeof(decimal));

        DataColumn dcSecurdedMark = new DataColumn("Secured_Mark", typeof(decimal));
        dtEducation.Columns.Add(dcExam);

        dtEducation.Columns.Add(dcCollege);

        dtEducation.Columns.Add(dcTotalMark);
        dtEducation.Columns.Add(dcSecurdedMark);

        foreach (GridViewRow gr in grdEducation.Rows)

        {

            TextBox txtExamination = (TextBox)gr.FindControl("txtExamination");

            TextBox txtCollege = (TextBox)gr.FindControl("txtCollege");

            TextBox txtTotalMark = (TextBox)gr.FindControl("txtTotalMark");

            TextBox txtMarksSecured = (TextBox)gr.FindControl("txtMarksSecured");

            DataRow drNew = dtEducation.NewRow();

            drNew["Exam_Name"] = txtExamination.Text;

            drNew["College_Name"] = txtCollege.Text;

            drNew["Total_Mark"] = Decimal.Parse(txtTotalMark.Text);

            drNew["Secured_Mark"] = Decimal.Parse(txtMarksSecured.Text);

            dtEducation.Rows.Add(drNew);

        }

        SqlConnection con = new SqlConnection("---Your Connection String---");

        SqlCommand insertEducations = new SqlCommand("InsertEducationDetails", con);

        insertEducations.CommandType = CommandType.StoredProcedure;

        insertEducations.Parameters.AddWithValue("@Education", dtEducation);

        con.Open();

        insertEducations.ExecuteNonQuery();

        con.Close();

    }

After that i entered values to be entered by debugging the page.

After clicking the save button, the values will be inserted to the database.

Result:

Regards,

Prajanuranjan....