王朝网络
分享
 
 
 

DataGridWeb控件深度历险(2)Part1

王朝other·作者佚名  2008-05-19
宽屏版  字体: |||超大  

导言

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

<asp:datagrid runat="server" /

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

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

设定DataGrid格式

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

<%@ Import Namespace="System.Drawing" %

<script runat="server"

sub Page_Load(sender as Object, e as EventArgs)

...

DataGridID.BackColor = Color.Red

...

end sub

</script

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

<asp:datagrid runat="server" BackColor="Red" /

我个人喜欢后一种方法。我发现在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 ― 设定表格在页面上的对齐方式(左对齐、右对齐、居中、未设定)

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

<asp:DataGrid runat="server" id="dgFAQs"

BackColor="#eeeeee" Width="85%"

HorizontalAlign="Center"

Font-Bold="True" Font-Name="Verdana"

Font-Size="10pt" /

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的外观非常有效。这些样式支持很多属性,包括BackColor、ForeColor、HorizontalAlign和 Width。(参考文档可获得更多信息)。DataGrid包括四类样式:

l

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

l

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

l

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

l

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

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

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

<asp:DataGrid runat="server"

<HeaderStyle BackColor="Red" /

</asp:DataGrid

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

<asp:DataGrid runat="server" id="dgFAQs"

BackColor="#eeeeee" Width="85%"

HorizontalAlign="Center"

Font-Name="Verdana"

Font-Size="10pt"

<HeaderStyle BackColor="Black" ForeColor="White"

Font-Bold="True" HorizontalAlign="Center" /

<AlternatingItemStyle BackColor="White" /

</asp:datagrid

示例运行结果如下:

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控件的全局显示属性(格式),下面还需要研究一个主题:如何对每一个特定列设定样式和显示属性。我们将在本文第二部分讨论这项技术。

 
 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
2023年上半年GDP全球前十五强
 百态   2023-10-24
美众议院议长启动对拜登的弹劾调查
 百态   2023-09-13
上海、济南、武汉等多地出现不明坠落物
 探索   2023-09-06
印度或要将国名改为“巴拉特”
 百态   2023-09-06
男子为女友送行,买票不登机被捕
 百态   2023-08-20
手机地震预警功能怎么开?
 干货   2023-08-06
女子4年卖2套房花700多万做美容:不但没变美脸,面部还出现变形
 百态   2023-08-04
住户一楼被水淹 还冲来8头猪
 百态   2023-07-31
女子体内爬出大量瓜子状活虫
 百态   2023-07-25
地球连续35年收到神秘规律性信号,网友:不要回答!
 探索   2023-07-21
全球镓价格本周大涨27%
 探索   2023-07-09
钱都流向了那些不缺钱的人,苦都留给了能吃苦的人
 探索   2023-07-02
倩女手游刀客魅者强控制(强混乱强眩晕强睡眠)和对应控制抗性的关系
 百态   2020-08-20
美国5月9日最新疫情:美国确诊人数突破131万
 百态   2020-05-09
荷兰政府宣布将集体辞职
 干货   2020-04-30
倩女幽魂手游师徒任务情义春秋猜成语答案逍遥观:鹏程万里
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案神机营:射石饮羽
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案昆仑山:拔刀相助
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案天工阁:鬼斧神工
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案丝路古道:单枪匹马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:与虎谋皮
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:李代桃僵
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:指鹿为马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:小鸟依人
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:千金买邻
 干货   2019-11-12
 
>>返回首页<<
推荐阅读
 
 
频道精选
 
静静地坐在废墟上,四周的荒凉一望无际,忽然觉得,凄凉也很美
© 2005- 王朝网络 版权所有