62,047
社区成员
发帖
与我相关
我的任务
分享GridView双层表头应该怎么做？
现在我把我刚写好的单层表头贴一下，就是很普通的GridView+dataTable方式。
前台
禁用了自动生成列->AutoGenerateColumns=false
后台生成dataTalble代码如下
从我的代码可以看出，就是普通的GridView+DataTable方式绑定的。我想实现的效果是->上前台代码中的第2~4列添加一个“今日”列，在最后“三列”头部加一个“昨日”列。
在网上搜了一些，自己也正在研究中。。。发个帖子的目的是希望高手给点快速完成这个功能的方案（比如最好不要破坏我原有的后台代码结构）
前台
<asp:GridView ID="gv_EmployeeP" runat="server" AutoGenerateColumns="False"
OnRowDataBound="gv_OrderInfo_RowDataBound">
<Columns>
<asp:BoundField DataField="客服" HeaderText="客服" ReadOnly="True">
<HeaderStyle Font-Bold="True" />
<ItemStyle Width="40px" />
</asp:BoundField>
<asp:BoundField DataField="今日总共" HeaderText="总共" ReadOnly="True">
<HeaderStyle Font-Bold="True" />
<ItemStyle Width="40px" />
</asp:BoundField>
<asp:BoundField DataField="今日已到" HeaderText="已到" ReadOnly="True">
<HeaderStyle Font-Bold="True" />
<ItemStyle Width="40px" />
</asp:BoundField>
<asp:BoundField DataField="今日未到" HeaderText="未到" ReadOnly="True">
<HeaderStyle Font-Bold="True" />
<ItemStyle Width="40px" />
</asp:BoundField>
<asp:BoundField DataField="昨日总共" HeaderText="总共" ReadOnly="True">
<HeaderStyle Font-Bold="True" />
<ItemStyle Width="40px" />
</asp:BoundField>
<asp:BoundField DataField="昨日已到" HeaderText="已到" ReadOnly="True">
<HeaderStyle Font-Bold="True" />
<ItemStyle Width="40px" />
</asp:BoundField>
<asp:BoundField DataField="昨日未到" HeaderText="未到" ReadOnly="True">
<HeaderStyle Font-Bold="True" />
<ItemStyle Width="40px" />
</asp:BoundField>
<asp:BoundField DataField="昨日总共" HeaderText="总共" ReadOnly="True">
<HeaderStyle Font-Bold="True" />
<ItemStyle Width="40px" />
</asp:BoundField>
</Columns>
</asp:GridView>
禁用了自动生成列->AutoGenerateColumns=false
后台生成dataTalble代码如下
private DataTable OneSelfData(DataTable _dt)
{
DataTable dt = new DataTable("Table_OneSelf");
dt.Columns.Add("客服", System.Type.GetType("System.String"));
dt.Columns.Add("今日总共", System.Type.GetType("System.Int32"));
dt.Columns.Add("今日已到", System.Type.GetType("System.Int32"));
dt.Columns.Add("今日未到", System.Type.GetType("System.Int32"));
dt.Columns.Add("昨日总共", System.Type.GetType("System.Int32"));
//。。省略
DataRow dr = dt.NewRow();
//中间代码省略
dt.Rows.Add(dr);
return dt;
}
从我的代码可以看出，就是普通的GridView+DataTable方式绑定的。我想实现的效果是->上前台代码中的第2~4列添加一个“今日”列，在最后“三列”头部加一个“昨日”列。
在网上搜了一些，自己也正在研究中。。。发个帖子的目的是希望高手给点快速完成这个功能的方案（比如最好不要破坏我原有的后台代码结构）
...全文
请发表友善的回复…
发表回复
orochiheart 2012-04-28
- 打赏
- 举报
q___p
我只能说 你太有才了。。。非常感谢！ 结帖。
我只能说 你太有才了。。。非常感谢！ 结帖。
传递正能量 2012-04-28
- 打赏
- 举报
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm4.aspx.cs" Inherits="WebTest.WebForm4" %>
<!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">
<asp:GridView ID="gv_EmployeeP" runat="server" AutoGenerateColumns="False"
OnRowDataBound="gv_OrderInfo_RowDataBound"
onrowcreated="gv_EmployeeP_RowCreated">
<Columns>
<asp:BoundField DataField="客服" HeaderText="客服" ReadOnly="True">
<HeaderStyle Font-Bold="True" />
<ItemStyle Width="40px" />
</asp:BoundField>
<asp:BoundField DataField="今日总共" HeaderText="总共" ReadOnly="True">
<HeaderStyle Font-Bold="True" />
<ItemStyle Width="40px" />
</asp:BoundField>
<asp:BoundField DataField="今日已到" HeaderText="已到" ReadOnly="True">
<HeaderStyle Font-Bold="True" />
<ItemStyle Width="40px" />
</asp:BoundField>
<asp:BoundField DataField="今日未到" HeaderText="未到" ReadOnly="True">
<HeaderStyle Font-Bold="True" />
<ItemStyle Width="40px" />
</asp:BoundField>
<asp:BoundField DataField="昨日总共" HeaderText="总共" ReadOnly="True">
<HeaderStyle Font-Bold="True" />
<ItemStyle Width="40px" />
</asp:BoundField>
<asp:BoundField DataField="昨日已到" HeaderText="已到" ReadOnly="True">
<HeaderStyle Font-Bold="True" />
<ItemStyle Width="40px" />
</asp:BoundField>
<asp:BoundField DataField="昨日未到" HeaderText="未到" ReadOnly="True">
<HeaderStyle Font-Bold="True" />
<ItemStyle Width="40px" />
</asp:BoundField>
<asp:BoundField DataField="昨日总共" HeaderText="总共" ReadOnly="True">
<HeaderStyle Font-Bold="True" />
<ItemStyle Width="40px" />
</asp:BoundField>
</Columns>
</asp:GridView>
</form>
</body>
</html>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
namespace WebTest
{
public partial class WebForm4 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
this.gv_EmployeeP.DataSource = this.OneSelfData(null);
this.gv_EmployeeP.DataBind();
}
private DataTable OneSelfData(DataTable _dt)
{
DataTable dt = new DataTable("Table_OneSelf");
dt.Columns.Add("客服", System.Type.GetType("System.String"));
dt.Columns.Add("今日总共", System.Type.GetType("System.Int32"));
dt.Columns.Add("今日已到", System.Type.GetType("System.Int32"));
dt.Columns.Add("今日未到", System.Type.GetType("System.Int32"));
dt.Columns.Add("昨日总共", System.Type.GetType("System.Int32"));
dt.Columns.Add("昨日已到", System.Type.GetType("System.Int32"));
dt.Columns.Add("昨日未到", System.Type.GetType("System.Int32"));
//。。省略
DataRow dr = dt.NewRow();
dr[0] = "测试0";
dr[1] = 1;
dr[2] = 2;
dr[3] = 3;
dr[4] = 4;
dr[5] = 5;
dr[6] = 6;
dt.Rows.Add(dr);
DataRow dr1 = dt.NewRow();
dr1[0] = "测试1";
dr1[1] = 0;
dr1[2] = 0;
dr1[3] = 0;
dr1[4] = 0;
dr1[5] = 0;
dr1[6] = 0;
dt.Rows.Add(dr1);
return dt;
}
protected void gv_OrderInfo_RowDataBound(object sender, GridViewRowEventArgs e)
{
}
protected void gv_EmployeeP_RowCreated(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType== DataControlRowType.Header)
{
e.Row.Cells[0].Text="<tr><th>客服</th>" +
" <th colspan='3'>今日</th>" +
" <th colspan='3'>昨日</th>" +
" <th >呵呵</th>" +
" </tr>" +
"<tr><td>客服";
}
}
}
}
dalmeeme 2012-04-28
- 打赏
- 举报
把这6个列改成<HeaderStyle Font-Bold="True" Height="50px" VerticalAlign="Bottom" />
把文字靠下，然后贴个div上去，就可以了。
把文字靠下，然后贴个div上去，就可以了。
传递正能量 2012-04-28
- 打赏
- 举报
http://www.cnblogs.com/scottpei/archive/2010/08/06/1794461.html
代码请稍等
代码请稍等
tan598121925 2012-04-28
- 打赏
- 举报
帮顶了，顺便学习orochiheart 2012-04-28
- 打赏
- 举报
今天肿么这么冷清呀。。。
