ASP.NET GirdView实现折叠式效果

我们线看图的效果:

但是有个非常不爽的地方,就是GridView要进行回发操作,所以,点击或者展开折叠节点,都会进行数据的回发。

实现的原理是这样的,首先看一下绑定到GridView的datatable数据表格:

可以看到本数据集的构造方式,即parentID下面保存的都是父ID的节点,而ChildID为空;但是当某行数据为子类时,父类的 ParentID置空,而ChildID则存入子类ID值。这样,把这个数据集赋值给GridView的时候,稍微处理就可以达到开始的图片效果了,具体操作如下:

首先,需要在GridView的首列添加两个ImageButton按钮,分别为“MinBT”(-)和“PluseBT”(+),还包括一个 image标签。然后就是在RowCreated的时候,将GridView的行值赋值给imagebutton的commandargument属性,同时将datatable中数据的前两行ParentID和ChildID隐藏掉,具体代码如下:

 

 protected void GridView1_RowCreated(object sender, GridViewRowEventArgs e)
    {
        if (e.Row.RowType == DataControlRowType.Header)
        {
            e.Row.Cells[1].Visible = false;
            e.Row.Cells[2].Visible = false;
        }
        if (e.Row.RowType == DataControlRowType.DataRow)
        {
            e.Row.Cells[1].Visible = false;
            e.Row.Cells[2].Visible = false;
            ImageButton btnMin = (ImageButton)e.Row.Cells[0].FindControl("MinBT");
            btnMin.CommandArgument = e.Row.RowIndex.ToString();
            ImageButton btnAdd = (ImageButton)e.Row.Cells[0].FindControl("PluseBT");
            btnAdd.CommandArgument = e.Row.RowIndex.ToString();
        }
    }
 

然后,就是对按钮进行处理了,让有子节点的父类显示“+”按钮,而让没有子节点的父类显示“-”按钮,这需要在GridView1_RowDataBound事件中处理,具体代码如下:

protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
    {
        if (e.Row.RowType == DataControlRowType.DataRow)
        {
            string ShowHide = e.Row.Cells[1].Text;
            ShowHide = ShowHide.Replace(" ", "");    
            ShowHide = ShowHide.Replace(" ","");
            if (ShowHide.Trim().Length == 0)  //如果有子类,前面就会有空白,替换掉后,长度为0,反之则不为0
            {
                ImageButton btnMin = (ImageButton)e.Row.Cells[0].FindControl("MinBT");
                btnMin.Visible = false;   //不显示已展开按钮
                ImageButton btnAdd = (ImageButton)e.Row.Cells[0].FindControl("PluseBT");
                btnAdd.Visible = false;  //不显示可展开按钮
                HtmlImage Line = (HtmlImage)e.Row.Cells[0].FindControl("Line");
                Line.Visible = true;  //显示虚线框
            }
            else
            {
                HtmlImage Line = (HtmlImage)e.Row.Cells[0].FindControl("Line");
                Line.Visible = false;  //反之,则不现实虚线框
            }
        }
    }

 然后就是处理按钮的点击事件了:

 

protected void GridView1_RowCommand(object sender, GridViewCommandEventArgs e)
    {
       
        if (e.CommandName == "_Show")  //当点击展开按钮时
        {
            int index = Convert.ToInt32(e.CommandArgument);  //获取第几行
            GridViewRow row = GridView1.Rows[index];
            int G_Count = GridView1.Rows.Count;  //查出总行数
            for (int i = index + 1; i < G_Count; i++)  //从本行下面一行开始
            {
                if (GridView1.Rows[i].Cells[1].Text == " ")  //如果遇见是子类
                {
                    GridView1.Rows[i].Visible = true;  //那么本行显示
                }
                else  //如果遇见的不是子类
                {
                    ImageButton Bt_Min = (ImageButton)row.Cells[0].FindControl("MinBT");
                    Bt_Min.Visible = true;  //那么已展开按钮显示
                    ImageButton Bt_plus = (ImageButton)row.Cells[0].FindControl("PluseBT");
                    Bt_plus.Visible = false;  //未展开按钮隐藏
                    break;

                }
                ImageButton Bt_Min1 = (ImageButton)row.Cells[0].FindControl("MinBT");
                Bt_Min1.Visible = true;
                ImageButton Bt_plus1 = (ImageButton)row.Cells[0].FindControl("PluseBT");
                Bt_plus1.Visible = false;
            }

        }
        if (e.CommandName == "_Hide")
        {
            int index = Convert.ToInt32(e.CommandArgument);
            GridViewRow row = GridView1.Rows[index];
            int G_Count = GridView1.Rows.Count;
            for (int i = index + 1; i < G_Count; i++)
            {
                if (GridView1.Rows[i].Cells[1].Text == " ")
                {
                    GridView1.Rows[i].Visible = false;
                }
                else
                {
                    ImageButton Bt_Min = (ImageButton)row.Cells[0].FindControl("MinBT");
                    Bt_Min.Visible = false;
                    ImageButton Bt_plus = (ImageButton)row.Cells[0].FindControl("PluseBT");
                    Bt_plus.Visible = true;
                    break;

                }
                ImageButton Bt_Min1 = (ImageButton)row.Cells[0].FindControl("MinBT");
                Bt_Min1.Visible = false;
                ImageButton Bt_plus1 = (ImageButton)row.Cells[0].FindControl("PluseBT");
                Bt_plus1.Visible = true;
            }

        }

 

 所有代码如下:

 

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
using System.Data.SqlClient;
using System.Web.UI.HtmlControls;

public partial class Default2 : System.Web.UI.Page
{
    public string connStr = System.Configuration.ConfigurationManager.AppSettings["connStr"];

    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            using (SqlConnection conn = new SqlConnection(connStr))
            {
                conn.Open();
                string sql = "SELECT ParentName,ParentID,dateof FROM TreeParent tp ";
                SqlCommand cmd = new SqlCommand(sql, conn);
                DataTable dt = new DataTable();
                dt.Columns.Add(new DataColumn("ParentID", typeof(string)));
                dt.Columns.Add(new DataColumn("ChildID", typeof(string)));
                dt.Columns.Add(new DataColumn("Name", typeof(string)));
                dt.Columns.Add(new DataColumn("Dateof", typeof(string)));
                SqlDataReader sdr = cmd.ExecuteReader();
                while (sdr.Read())
                {
                    DataRow dr = dt.NewRow();
                    int pID = Convert.ToInt32(sdr["ParentID"]);
                    dr["ParentID"] = (sdr["ParentID"]);
                    dr["ChildID"] = null;
                    dr["Name"] = sdr["ParentName"];
                    dr["Dateof"] = sdr["Dateof"];
                    dt.Rows.Add(dr);
                    DataTable myDT = GenerateDT(pID.ToString());
                    foreach (DataRow drChild in myDT.Rows)
                    {
                        DataRow drChildDT = dt.NewRow();
                        drChildDT["ChildID"] = drChild["ChildID"];
                        drChildDT["Name"] = drChild["ChildName"];
                        drChildDT["Dateof"] = drChild["Dateof"];
                        dt.Rows.Add(drChildDT);
                    }
                }
                sdr.Close();
                GridView1.DataSource = dt;
                GridView1.DataBind();
            }

        }
    }

    protected DataTable GenerateDT(string ParentID)
    {
        using (SqlConnection conn = new SqlConnection(connStr))
        {
            conn.Open();

            DataTable dt = new DataTable();
            dt.Columns.Add(new DataColumn("ChildName", typeof(string)));
            dt.Columns.Add(new DataColumn("ChildID", typeof(string)));
            dt.Columns.Add(new DataColumn("Dateof", typeof(string)));
            string sql = "SELECT childID,childName,dateof FROM TreeChild tc where tc.ParentID=" + ParentID;
            SqlCommand cmd = new SqlCommand(sql, conn);
            SqlDataReader sdr = cmd.ExecuteReader();
            while (sdr.Read())
            {
                DataRow dr = dt.NewRow();
                dr["ChildName"] = sdr["childName"];
                dr["ChildID"] = sdr["ChildID"];
                dr["Dateof"] = sdr["Dateof"];
                dt.Rows.Add(dr);
            }
            sdr.Close();
            return dt;
        }
    }


    protected void GridView1_RowCreated(object sender, GridViewRowEventArgs e)
    {
        if (e.Row.RowType == DataControlRowType.Header)
        {
            e.Row.Cells[1].Visible = false;
            e.Row.Cells[2].Visible = false;
        }
        if (e.Row.RowType == DataControlRowType.DataRow)
        {
            e.Row.Cells[1].Visible = false;
            e.Row.Cells[2].Visible = false;
            ImageButton btnMin = (ImageButton)e.Row.Cells[0].FindControl("MinBT");
            btnMin.CommandArgument = e.Row.RowIndex.ToString();
            ImageButton btnAdd = (ImageButton)e.Row.Cells[0].FindControl("PluseBT");
            btnAdd.CommandArgument = e.Row.RowIndex.ToString();
        }
    }
    protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
    {
        if (e.Row.RowType == DataControlRowType.DataRow)
        {
            string ShowHide = e.Row.Cells[1].Text;
            ShowHide = ShowHide.Replace(" ", "");
            ShowHide = ShowHide.Replace(" ","");
            if (ShowHide.Trim().Length == 0)
            {
                ImageButton btnMin = (ImageButton)e.Row.Cells[0].FindControl("MinBT");
                btnMin.Visible = false;
                ImageButton btnAdd = (ImageButton)e.Row.Cells[0].FindControl("PluseBT");
                btnAdd.Visible = false;
                HtmlImage Line = (HtmlImage)e.Row.Cells[0].FindControl("Line");
                Line.Visible = true;
            }
            else
            {
                HtmlImage Line = (HtmlImage)e.Row.Cells[0].FindControl("Line");
                Line.Visible = false;
            }
        }
    }
    protected void GridView1_RowCommand(object sender, GridViewCommandEventArgs e)
    {
       
        if (e.CommandName == "_Show")
        {
            int index = Convert.ToInt32(e.CommandArgument);
            GridViewRow row = GridView1.Rows[index];
            int G_Count = GridView1.Rows.Count;
            for (int i = index + 1; i < G_Count; i++)
            {
                if (GridView1.Rows[i].Cells[1].Text == " ")
                {
                    GridView1.Rows[i].Visible = true;
                }
                else
                {
                    ImageButton Bt_Min = (ImageButton)row.Cells[0].FindControl("MinBT");
                    Bt_Min.Visible = true;
                    ImageButton Bt_plus = (ImageButton)row.Cells[0].FindControl("PluseBT");
                    Bt_plus.Visible = false;
                    break;

                }
                ImageButton Bt_Min1 = (ImageButton)row.Cells[0].FindControl("MinBT");
                Bt_Min1.Visible = true;
                ImageButton Bt_plus1 = (ImageButton)row.Cells[0].FindControl("PluseBT");
                Bt_plus1.Visible = false;
            }

        }
        if (e.CommandName == "_Hide")
        {
            int index = Convert.ToInt32(e.CommandArgument);
            GridViewRow row = GridView1.Rows[index];
            int G_Count = GridView1.Rows.Count;
            for (int i = index + 1; i < G_Count; i++)
            {
                if (GridView1.Rows[i].Cells[1].Text == " ")
                {
                    GridView1.Rows[i].Visible = false;
                }
                else
                {
                    ImageButton Bt_Min = (ImageButton)row.Cells[0].FindControl("MinBT");
                    Bt_Min.Visible = false;
                    ImageButton Bt_plus = (ImageButton)row.Cells[0].FindControl("PluseBT");
                    Bt_plus.Visible = true;
                    break;

                }
                ImageButton Bt_Min1 = (ImageButton)row.Cells[0].FindControl("MinBT");
                Bt_Min1.Visible = false;
                ImageButton Bt_plus1 = (ImageButton)row.Cells[0].FindControl("PluseBT");
                Bt_plus1.Visible = true;
            }

        }
        
    }
}

前台代码如下:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %>

<!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>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    
        <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" 
            CellPadding="4" ForeColor="#333333" GridLines="None" 
            onrowcommand="GridView1_RowCommand" onrowcreated="GridView1_RowCreated" 
            onrowdatabound="GridView1_RowDataBound" Width="456px">
            <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
            <Columns>
                <asp:TemplateField HeaderText="操作">
                    <ItemTemplate>
                        <asp:ImageButton ID="PluseBT" runat="server" Visible="false" CommandName="_Show" BackColor="White" BorderStyle="none" ImageUrl="~/plus.gif" />
                        <asp:ImageButton ID="MinBT" runat="server" CommandName="_Hide" BackColor="White" BorderStyle="none" ImageUrl="~/minus.gif" />
                        <img id="Line" runat="server" visible="false" src="~/line.gif"/>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:BoundField DataField="ParentID" HeaderText="Parent Id" />
                <asp:BoundField DataField="ChildId" HeaderText="Child Id" />
                <asp:BoundField DataField="Name" HeaderText="名称" />
                <asp:BoundField DataField="Dateof" HeaderText="时间" />
            </Columns>

            <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
            <PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
            <SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
            <HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
            <EditRowStyle BackColor="#999999" />
            <AlternatingRowStyle BackColor="White" ForeColor="#284775" />
        </asp:GridView>
    
    </div>
    </form>
</body>
</html>
阅读更多
版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/zhang399401/article/details/6870184
个人分类: .NET
想对作者说点什么? 我来说一句

没有更多推荐了,返回首页

关闭
关闭
关闭