ASP.NET GirdView实现折叠式效果

来源:互联网 发布:征信大数据是什么意思 编辑:程序博客网 时间:2024/04/28 07:47

我们线看图的效果:

但是有个非常不爽的地方,就是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>