ASP.NET GridView 实现课程表显示(动态合并单元格)实现步骤
GridView，ASP.NET中很常用的数据显示控件，这里，我将用这个控件来实现课程表的显示。首先说说课程表的显示与普通记录的显示有何不同？这里所说的普通记录是指直接从数据库中查询出来的、没有经过任何处理的记录。通常，我们用GridView显示这些普通记录，只需直接将这些记录表绑定到GridView中即可。但是，课程表的显示可不是这么简单，它需要将普通记录继续加工，需要根据记录中具体的数据来确定数据需要显示在哪一行、哪一列，而且需要根据课程开始时间和结束时间动态合并单元格，最后才是数据的显示。这就是课程表显示的难点之所在。好了，下面就看看我是如何实现的吧。
.aspx文件中代码：
代码如下:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="test.aspx.cs" Inherits="DataBind.test" %>
<%@ Register assembly="Microsoft.ReportViewer.WebForms, Version=10.0.0.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a" namespace="Microsoft.Reporting.WebForms" tagprefix="rsweb" %>
<!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"
onrowdatabound="GridView1_RowDataBound1" BorderWidth="1">
<HeaderStyle Wrap="False" />
<RowStyle HorizontalAlign="Center" VerticalAlign="Middle" />
</asp:GridView>
</div>
</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.SqlClient;
using System.Data;
using System.Text.RegularExpressions;
namespace DataBind
{
public partial class test : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
SqlConnection con = DB.createCon();//创建连接对象
SqlDataAdapter sda = new SqlDataAdapter();
sda.SelectCommand = new SqlCommand("Select * from Schedule ", con);
DataSet ds = new DataSet();
sda.Fill(ds);
DataTable table = new DataTable();
table = ds.Tables[0];
DataTable dtSchedule = new DataTable();//此表用于存放转换后的课程表（格式与日常见到的一样）
//添加八列
dtSchedule.Columns.Add("课程表");
for (int i = 1; i < 8; i++)
{
dtSchedule.Columns.Add("星期" + WeekConvertToChinese(i));
}
//添加八行
for (int i = 0; i < 8; i++)
{
dtSchedule.Rows.Add();
}
//添加左侧固定信息（第几节课）
for (int i = 0; i < 8; i++)
{
dtSchedule.Rows[i][0] = "第" + ConvertToChinese(i+1) + "节";
}
//此数组用于存放需要合并的单元格信息。如：需要合并第一列的一、二单元格
//那么，数组中一行的三个数分别为1,1,2
int[][] tempArray = new int[table.Rows.Count][];
//数组初始化
for (int i = 0; i < table.Rows.Count; i++)
{
tempArray[i] = new int[3];
for (int j = 0; j < 3; j++)
{
tempArray[i][j] = 0;
}
}
//遍历table，将每条课表信息填在tab中适当的位置。
for (int i = 0; i < table.Rows.Count; i++)
{
//课是周几的课
string week = Convert.ToString(table.Rows[i]["Week"]);
//课开始时间
string startTime =Convert.ToString( table.Rows[i]["StartTime"]);
//课结束时间
string endTime = Convert.ToString(table.Rows[i]["EndTime"]);
for (int weekCount = 1; weekCount < 8; weekCount++)//确定本条数据将来显示在哪一列
{
if (week == Convert.ToString(dtSchedule.Columns[weekCount].ColumnName))//跟星期做比较，确定数据应该写在那一列
{
tempArray[i][0] = weekCount;//记录星期（确定将来的数据显示在哪一列）
break;
}
}
for (int j = 0; j < dtSchedule.Rows.Count; j++)//确定课程的开始时间和结束时间，并填写数据
{
string section =Convert.ToString( dtSchedule.Rows[j][0]);//当前行是第几节课
if (section == startTime)//判断课程开始时间，确定位置，填写数据
{
tempArray[i][1] = j;//记录上课开始时间（确定数据数据显示在哪一行）
dtSchedule.Rows[j][tempArray[i][0]] = Convert.ToString(table.Rows[i]["CourseName"]) + "<br />" +
Convert.ToString(table.Rows[i]["TeacherName"]);
}
if (section == endTime)//判断课程结束时间，记录位置
{
tempArray[i][2] = j;//记录课结束时间
break;
}
}
}
GridView1.DataSource = dtSchedule;
GridView1.DataBind();
//合并单元格
for (int i = 0; i < table.Rows.Count; i++)
GroupCol(GridView1, tempArray[i][0], tempArray[i][1], tempArray[i][2]);
}
/// <summary>
/// 合并某列中的多个单元格
/// </summary>
/// <param name="GridView1"></param>
/// <param name="cols">要合并的那一列</param>
/// <param name="sRow">开始行</param>
/// <param name="eRow">结束行</param>
public static void GroupCol(GridView GridView1, int cols, int sRow, int eRow)
{
//if (GridView1.Rows.Count < 1 || cols > GridView1.Columns.Count - 1)
//{
// return;
//}
//if (GridView1.Rows.Count < 1 || cols > GridView1.Rows[0].Cells.Count - 1)
//{
// return;
//}
TableCell oldTc = GridView1.Rows[sRow].Cells[cols];
for (int i = 1; i <= eRow - sRow; i++)
{
TableCell tc = GridView1.Rows[sRow + i].Cells[cols];
tc.Visible = false;
if (oldTc.RowSpan == 0)
{
oldTc.RowSpan = 1;
}
oldTc.RowSpan++;
oldTc.VerticalAlign = VerticalAlign.Middle;
}
}
string ConvertToChinese(int x)
{
string cstr = "";
switch (x)
{
case 0: cstr = "零"; break;
case 1: cstr = "一"; break;
case 2: cstr = "二"; break;
case 3: cstr = "三"; break;
case 4: cstr = "四"; break;
case 5: cstr = "五"; break;
case 6: cstr = "六"; break;
case 7: cstr = "七"; break;
case 8: cstr = "八"; break;
case 9: cstr = "九"; break;
}
return (cstr);
}
//转换星期几
string WeekConvertToChinese(int x)
{
string cstr = "";
switch (x)
{
case 1: cstr = "一"; break;
case 2: cstr = "二"; break;
case 3: cstr = "三"; break;
case 4: cstr = "四"; break;
case 5: cstr = "五"; break;
case 6: cstr = "六"; break;
case 7: cstr = "日"; break;
}
return (cstr);
}
/// <summary>
/// 使得GridView中的内容可以换行
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
protected void GridView1_RowDataBound1(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{
TableCellCollection cells = e.Row.Cells;
foreach (TableCell cell in cells)
{
cell.Text = Server.HtmlDecode(cell.Text); //注意：此处所有的列所有的html代码都会按照html格式输出，如果只需要其中的哪一列的数据需要转换，此处需要小的修改即可。
}
}
}
}
}
最终显示效果：
相关推荐
-
asp.net中GridView和DataGrid相同列合并实现代码
(一)普通列 复制代码 代码如下: /// <summary> /// Gridview列的合并(普通列,不包含模板列) /// 注意:1.GridView在绑定的时候进行分组和排序,才能让相同的行放在一起 /// 2.方法应用的时机,应该在Gridview的DataBound事件中使用 /// </summary> /// <param name="gv">需要合并的GridView对象</param> /// <param na
-
ASP.NET中GridView和Repeater重复数据如何合并
这几天做一个项目有用到表格显示数据的地方,客户要求重复的数据列需要合并,就总结了一下GridView 和 Repeater 关于重复数据合并的方法. 效果图如下 : GridView : 前台代码 : <div> <asp:GridView ID="gvIncome" runat="server" AutoGenerateColumns="False"> <Columns> <asp:TemplateFi
-
datalist,Repeater和Gridview的区别分析
griview优点:功能最强大,提供分页,编辑,删除,选择等等很多功能,使用最方便,直接拖拽到页面上,建立新的数据源,点几下鼠标就可以维护一个表的浏览.删除和修改了,而且是分页的哦.(增加我还没搞明白怎么能点几下鼠标就实现,如果您知道请告诉我.).而且因为模板已经定制好,想自己灵活控制,不太容易. 缺点:占用系统资源大,他的分页是把整个表的数据取出来,到gridview上分页的,因此如果数据量比较大的时候,速度非常非常慢.效率极低. datalist比较好控制样式..没有自带的分页..编辑等..
-
Asp.net程序优化js、css实现合并与压缩的方法
本文实例讲述了Asp.net程序优化js.css实现合并与压缩的方法.分享给大家供大家参考.具体实现方法如下: 访问时将js和css压缩并且缓存在客户端, 采用的是Yahoo.Yui.Compressor组件来完成的,用户可以点击此处本站下载. 创建一个IHttpHandler来处理文件 复制代码 代码如下: public class CombineFiles : IHttpHandler { private const string CacheKeyFormat = "_Cac
-
ASP.NET MVC4之js css文件合并功能(3)
MVC4增加了一些新功能,接下来,我们来研究下MVC4中的新增功能,我们在新建一个MVC4项目的时候,会发现在项目下多出了一个App_Start文件夹,文件夹下面有4个文件,BundleConfig.cs,FilterConfig.cs,RouteConfig.cs,WebApiConfig.cs,其中BundleConfig.cs文件就是我们这一节要讲的的文件. 众所周知,浏览器在向服务器发送请求的时候,请求的文件连接数量是有限制的.使用BundleConfig可以将多个文件请求和并成一个请求
-
asp.net中rdlc 合并行的方法
最终效果: 要合并内容行,我想是不可能的,我上网找了N久,也没找到,囧~ 后来经过自己的短暂思考,终于想到另一种合并了,:-) 实现方法很简单,就是在报表属性的代码里加上以下这段代码: 复制代码 代码如下: Function GetRemark(rowNum As Integer, remark As String) As String Dim cutLength As Integer = 10 Return Mid(remark, cutLength * (rowNum - 1) + 1, c
-
Asp.net_Table控件の单元格纵向合并示例
业务需要,动态生成表,同一列中数据相同的单元格需要合并. 解决方案,创建Table控件处理类,代码如下: 复制代码 代码如下: /// <summary>表格控件相关操作类 /// </summary> public static class aspTable { /// <summary>合并行 /// </summary> /// <remarks>版权信息:http://www.qqextra.com,http://t.qq.com/ls_
-
asp.net 合并GridView中某列相同信息的行（单元格）
解决方法如下(写在公共模块里,定义为静态方法方便调用): 复制代码 代码如下: /// <summary> /// 合并GridView中某列相同信息的行(单元格) /// </summary> /// <param name="GridView1">GridView</param> /// <param name="cellNum"
-
repeater、gridview 在绑定时判断判断显示不同的行样式或文本
一:repeater或DataList控件 1.更改纯文本内容等 如果数据库里学生信息表中的sex字段用0和1来表示男女 但我们想repeat控件绑定后性别显示男或女而不是显示0或1 方法一:当然我们可以在SQL语句里判断并且转换 select (case sex when 0 then '男' else '女' end) AS sex from studentInfo 方法二:就是用到repeat 控件ItemDataBound()事件 前台 复制代码 代码如下: <asp:Repearter
-
asp.net中让Repeater和GridView支持DataPager分页
改造办法是自己写一个控件,让它继承GridView或Repeater,并实现IPageableItemContainer 接口.下面要发的是国外某高手写的代码,测试有效.具体使用的时候,要建一个类库项目,把代码编译成dll后,就可以添加到VS的工具箱里了! 一.自定义Repeater 复制代码 代码如下: using System.Web.UI; using System.Web.UI.WebControls; namespace WYJ.Web.Controls { /// <summary>