DataGrid Web控件深度历险(2) Part1

原创 2004年03月22日 16:15:00

<?xml:namespace prefix = o ns = "urn:schemas-microsoft-com:office:office" />

 

导言

在第一部分我们研究了DataGrid的基本功能,它可在HTML表格中显示数据。在第一部分我么说明了将数据库内容绑定至DataGrid是非常简单的,我们所要做的就是通过SQL查询来生成一个DataReader对象,将DataGridDataSource属性设为这个DataReader对象,然后调用DataGrid对象的DataBind()方法。剩下的事情就是将DataGrid放置到HTML中,它可通过如下代码实现:

就是这么简单。遗憾的是通过这种简单方法生成的DataGrid并不美观。生成的DataGrid仅仅是一个封装了DataReader中所有列和行的简单的HTML表格。

我们希望做到的是仅显示DataReader中的部分列并且设定每一列的格式。并且希望设定诸如背景颜色、字体等可以应用到整个表格的格式。最后,如果能够为每一列加上自定义的标题就更好了。例如设定标题的背景色为不同的颜色或字体为粗体。在这部分我们将研究如何完成所有这些任务!(DataGrid可以做更多的事情,我们将在今后一系列文章中看到如何对数据库结果进行分页显示,允许用户对数据排序等。)

设定DataGrid格式

对于DataGrid我们有两种设定格式的方法。第一种方法是在服务器端代码中通过程序进行设定。例如为了将DataGrid的背景色设定为红色,可使用如下服务器端代码:

另一种设定显示属性的方法是在DataGrid Web控件的标记中进行设定。下面的代码和上面的代码效果是一样的:



我个人喜欢后一种方法。我发现在Web控件的标记中设定显示属性比在服务器端代码中设定要简洁。(请注意,对于服务器端代码的方法,需要引入System.Drawing命名空间,才能通过Color.Red对颜色进行引用;对于在Web控件的标记中设定显示属性的方法,仅需写上BackColor="Red"我觉得后一种方法更可读。)

让我们看一下用于设定DataGrid格式的有用的属性:

l        BackColor 设定背景颜色。

l        Font 设定DataGrid的字体信息。字体信息包括使用何种字体、字号,是否粗体,斜体等。

l        CellPadding 设定HTML表格中单元格内的边距。

l        CellSpacing 设定HTML表格中单元格之间的间距。

l        Width 设定HTML表格的宽度(可以以像素、百分比等为单位)

l        HorizontalAlign 设定表格在页面上的对齐方式(左对齐、右对齐、居中、未设定)

一个使用上述属性而使得表格变得漂亮的例子如下所示。请注意DataGridFont属性是一个对象,它指向了FontInfo类,FontInfo类包括Size, Name, Bold, Italic等属性。为了设定Font对象所指向类的属性,必须通过连字符(-)完成。这类似于VB.NetC#语言中表示对象属性的点(.)

FAQID

Description

DateEntered

CatName

144

Where can I host my ASP Web site for free (similar to GeoCities or Tripod or any of the many other free Web site sites)?

 

3/20/2001 2:53:45 AM

Getting Started

181

How can I format numbers and date/times using ASP.NET? For example, I want to format a number as a currency.

 

1/19/2002 3:12:07 PM

ASP.NET

 

 

 

Databases, Errors

是否印象深刻?通过几行文本,我们改变了DataGrid的外观,生成了一个居中、具有灰色和漂亮字体的HTML表格。

通过样式发挥你的想象力

DataGrid Web控件包含一些样式,你将发现通过样式改变DataGrid的外观非常有效。这些样式支持很多属性,包括BackColorForeColorHorizontalAlign Width(参考文档可获得更多信息)DataGrid包括四类样式:

l        HeaderStyle 设定页眉的样式。(页眉指表格的最上面一行,它列出了每列的名称。要显示页眉,需将DataGridShowHeader属性设为True(缺省为True) )

l        FooterStyle —设定页脚的样式。(页脚指表格的最下面一行。要显示页脚,需将DataGridShowFooter属性True(缺省为False))

l        ItemStyle 设定表格中每一行的样式。

l        AlternatingItemStyle 设定表格中交替行的样式。通过将ItemStyleAlternatingItemStyle设为不同的值使得DataGrid便于阅读。(可参考下面的示例)

和设定DataGrid的格式类似,样式可通过程序或DataGrid Web控件的标记进行设定。如上所述,我个人喜欢使用Web控件的标记并且将在示例中使用该方法。第一种方法与通过代码设置DataGrid的格式类似,通过在对象后面加一个点。即如果想设定HeaderStyleBackColor,可在代码中通过HeaderStyle.BackColor=Color.Red实现。

另一个方法是通过在Web 控件的标记中使用特别的样式块,如下所示:

两种方法均可行。我发现嵌入标记的方法便于阅读,特别是当你需要为众多样式设定众多属性时。下面的示例显示如何美化先前的示例:

示例运行结果如下:

FAQID

Description

ViewCount

 

FAQCategoryID

DateEntered

144

Where can I host my ASP Web site for free (similar to GeoCities or Tripod or any of the many other free Web site sites)?

161319

20

3/20/2001 2:53:45 AM

181

How can I format numbers and date/times using ASP.NET? For example, I want to format a number as a currency.

124398

 

22

1/19/2002 3:12:07 PM

115

I am using Access and getting a 80004005 error (or a [Microsoft][ODBC Microsoft Access Driver] The Microsoft Jet database engine cannot open the file '(unknown)' error) when trying to open a connection! How can I fix this problem?

108377

 

21

1/17/2001 11:38:49 PM

 

 

 

 

 

现在我们已经研究了如何使用样式以及如何设定DataGrid控件的全局显示属性(格式),下面还需要研究一个主题:如何对每一个特定列设定样式和显示属性。我们将在本文第二部分讨论这项技术。

JTA深度历险-原理与实现

在 J2EE 应用中,事务是一个不可或缺的组件模型,它保证了用户操作的 ACID(即原子、一致、隔离、持久)属性。对于只操作单一数据源的应用,可以通过本地资源接口实现事务管理;对于跨数据源(例如多个数...
  • GV7lZB0y87u7C
  • GV7lZB0y87u7C
  • 2017年11月29日 00:00
  • 1357

DataGrid控件用法详解

转自:http://www.vckbase.com/document/viewdoc/?id=1164 作者:万建华 下载源代码 写在前面   刚写这个题目,就觉得肩上...
  • banrixianxin
  • banrixianxin
  • 2014年05月16日 00:23
  • 4201

datagrid自定义分页控件

  • qq_31971935
  • qq_31971935
  • 2016年08月10日 17:32
  • 489

详解WPF 4 DataGrid控件的基本功能

详解WPF 4 DataGrid控件的基本功能 提到DataGrid 不管是网页还是应用程序开发都会频繁使用。通过它我们可以灵活的在行与列间显示各种数据。本篇将详细介绍WPF 4 中DataGrid...
  • jiangxinyu
  • jiangxinyu
  • 2013年03月04日 16:05
  • 4083

VC DataGrid控件使用总结

MS CDataGrid控件用法详解 本文示例源代码或素材下载 。DataGrid控件是VC方便地用来显示数据的一个极好的网格控件,我不否认网上还有期它不少优秀的网格控件,但我总喜欢使用微...
  • bcbobo21cn
  • bcbobo21cn
  • 2016年04月01日 18:37
  • 1684

去哪网实习总结:easyui在JavaWeb中的使用,以datagrid为例(JavaWeb)

本来是以做数据挖掘的目的进去哪网的,结构却成了系统开发。。。 不过还是比较认真的做了三个月,老师很认同我的工作态度和成果。。。 实习马上就要结束了,总结一下几点之前没有注意过的变成习惯和问题,分享...
  • mmc2015
  • mmc2015
  • 2015年08月16日 21:35
  • 1324

DataGrid控件介绍

DataGrid控件介绍 1. 引言 Rich UI中的DataGrid组件可以在表中显示一组行数据。本文将详细介绍DataGrid组件相关信息。 如果想要较好的理解DataGrid,你...
  • lcczzu
  • lcczzu
  • 2015年07月14日 11:37
  • 433

VB.net数据库编程中DataGrid控件的使用技巧

如何用同一个DataGrid显示不同的数据表;如何用DataGrid显示主表/明细表的内容;如何用DataGrid分页显示或编辑数据表的记录。这些技巧在开发数据库程序中很实用。 DataGrid是VB...
  • jxjxlc
  • jxjxlc
  • 2016年11月10日 11:25
  • 2173

解决EasyUI的datagrid控件显示日期问题

在做积分系统的时候,做的是后台管理系统,所以前段框架用的是EasyUI,使用datagrid的时候,后台返回来一个日期格式的数据,当json序列化后返回来的数据就变成了/Date(1419264000...
  • cd18333612683
  • cd18333612683
  • 2017年06月12日 20:16
  • 792

数据绑定——DataGrid

绑定数据
  • wgp15732622312
  • wgp15732622312
  • 2016年05月15日 17:14
  • 510
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:DataGrid Web控件深度历险(2) Part1
举报原因:
原因补充:

(最多只允许输入30个字)