ASP.NET4 GridView的四种排序样式详解_实用技巧

与ASP.NET 的其他Web控件一能够,Gridview控件拥有很多不同的CSS样式属性设置,包括象CssClass,Font字体,ForeColor,BackColor,BackColor, Width, Height等等。Gridview还包括了一些应用在表格的行上的样式属性,比如RowStyle, AlternatingRowStyle, HeaderStyle,和PagerStyle,它们都提供了象CssClass和Font这些基本的属性设置。 

在 ASP.NET 4.0中的Gridview控件中,新增加了四个样式属性:SortedAscendingHeaderStlye,SortedAscendingCellStlye,SortedDescendingHeaderStyle 和SortedDescendingCellStyle。这四个属性有点像以前的RowStyle和HeaderStyle样式属性,但它们是应用在 gridview的列的,而不是行。当GridView需要排序的时候,这些属性才起作用,如果当gridview需要按升序排序的话,那么 SortedAscendingHeaderStyle和SortedAscendingCellStyle属性定义了数据排序时的样式风格。如果 gridview是降序排序时,SortedDescendingHeaderStyle和SortedDescendingCellStyle属性则定义了排序时的样式风格。 

这四个新的特性使在排序的时候,更容易定制数据排序时列的外观样式。这些属性与CSS样式搭配使用的话,可以在表格排序时增加向上的箭头和向下的箭头,以表明当前是按升序还是降序排序。本文将介绍如何使用这四个新的属性的样式。 

GridView中的排序回顾 

在Gridview中默认是文本的方式显示每一列的列头的。要排序的话,必须首先设置Gridview的AllowSorting属性,这将使 Gridview将要排序的列以链接的方式展现,当用户点击时,就会触发排序的事件。如果GridView绑定到数据源控件了,则你不必编写任何代码去处理排序,一切都是自动完成的。 

从用户的角度来看,点击标题行中的排序列一下,则会让表格中的该列数据以升序排序,同样再点击一下,则以降序排序。遗憾的是,在以往asp.net 中的GridView不提供任何的方法以显示给用户看,当前的排序列是按升序排序还是以降序排序。在asp.net 4.0之前,要实现的唯一方法只有编写一些代码了,使用Gridview增加SortAscendingStyle 和SortDescendingStyle两个属性,并且使用了CSS去模拟画出两个上下的箭头。 

而在ASP.NET 4.0中,已经内置了这样的功能了,下面讲解下。 

新的排序相关样式属性 

ASP.NET 4.0中新增的4个排序相关的属性如下: 

• SortedAscendingHeaderStyle 当Gridview以升序排列时,定义了排序列的表头样式。 

• SortedAscendingCellStyle 当Gridview以升序排列时,定义了要排序的数据列的样式。 

• SortedDescendingHeaderStyle 当Gridview以降序排列时,定义了排序列的表头样式。 

• SortedDescendingCellStyle 当Gridview以降序排列时,定义了要排序的数据列的样式。 

有了这些属性,在排序时,只需要简单对它们进行设置就可以了,比如下面的例子中,简单设置了SortedAscendingCellStyle属性和SortedDescendingCellStyle的子样式背景颜色为黄色,马上就可以看到效果了:

<asp:GridView ID="..." runat="server" AutoGenerateColumns="False" AllowSorting="true"
   ...
   SortedAscendingCellStyle-BackColor="Yellow"
   SortedDescendingCellStyle-BackColor="Yellow">
  ...
</asp:GridView>

 
 
当然,为了观察方便,可以设置 SortedAscendingCellStyle-BackColor和SortedDescendingCellStyle-BackColor为不同的颜色则可看到更清晰的效果。 
为排序列加上箭头 

使用的CSS配合SortedAscendingHeaderStyle和SortedDescendingHeaderStyle两个属性,则为排序列增加向上和向下箭头的表示排序状态是很容易的。首先,你需要找一些向上箭头或者向下箭头的图片,在本文的代码下载中是有这样的图片了。接者需要创建两个 CSS类,比如下文中的sortasc—header和sortdesc-header,在这两个CSS类中需要指定上下箭头图片所在的位置,同时我们要在排序列的右边定义一个适当的间隔位置,以便让向上和向下箭头不被排序列所在的表头的文本所覆盖。如下所示: 

.sortasc-header A
{
  background:url(URL to up arrow image) right center no-repeat;
} 

.sortdesc-header A
{
  background:url(URL to down arrow image) right center no-repeat;
} 

TH A
{
  padding-right: 20px;
}

 之后我们就可以利用这些样式了: 

<asp:GridView ID="..." runat="server" AutoGenerateColumns="False" AllowSorting="true"
   ...
   SortedAscendingHeaderStyle-CssClass="sortasc-header"
   SortedDescendingHeaderStyle-CssClass="sortdesc-header"
   SortedAscendingCellStyle-BackColor="Yellow"
   SortedDescendingCellStyle-BackColor="Yellow">
  ...
</asp:GridView>

 

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索asp.net
, gridview
排序
gridview 样式、yii2 gridview 样式、gridview控件使用详解、gridview 分页样式、yii2 gridview 列样式,以便于您获取更多的相关知识。

时间: 2024-11-02 22:35:43

ASP.NET4 GridView的四种排序样式详解_实用技巧的相关文章

分析10个ASP.NET控件最有用的属性详解_实用技巧

1.ClientIDMode 渲染ASP.NET控件时会自动生成一个ID,当我们在客户端脚本中引用它们时,却会制造不少麻烦,虽然它是命名容器和ID的简单串联,但仍然无法预测生成的ID范围. ASP.NET 4.0使用ClientIDMode属性解决了这个问题,它允许你控制生成这些ID的方法,ClientIDMode有四个可选择的值:AutoID,Static,Predictable和Inherit.下面是这四个值的含义解释: AutoID – 和4.0以前的版本保持一致,自动生成ID. Stat

ASP.NET中水晶报表的使用方法详解_实用技巧

前一段时间,由于在项目中要用到报表做统计,所以我学习了一下ASP.NET水晶报表的使用.水晶报表的执行模式(也就是取数据的方法)可以分为两种: 第一种是Pull模式:被请求时,水晶报表直接根据指定的驱动连接数据库然后组装这些数据. 另外一种就是Push模式:此时开发者不得不自己编写代码连接数据并组装DataSet,同时将它传送至报表.在些这种情况下,通过使用连接共享以及限制记录集合的大小,可以使用报表性能最大化. 水晶报表中的报表类型也分为两种: --StrongTyped 报表: 当你将报表文

asp.net 支付宝及时到帐接口使用详解_实用技巧

其实支付宝公司已经给我们做的很好了, 只要少量的改动就OK了,只是有的程序员不太明天他们的动作流程而以,我就以及时到帐为例子来说了,呵呵 在这之前就大家先下载一下c#版的及时到帐代码    这里是下载地址http://dev.alipay.com/devclub/mvnforum/viewthread_thread,4;jsessionid=595DB7442AAA5CD2FC849E7C2FBE51D7   先看一下程序的结构吧     支付宝有一个类文件叫  AliPay 是一些加密算法之类

asp.net中session的原理及应用详解_实用技巧

Session简介丶特性 -------------------------------------------------------------------------------- 1.Session是一种Web会话中的常用状态之一. 2.Session提供了一种把信息保存在服务器内存中的方式.他能储存任何数据类型,包含自定义对象. 3.每个客户端的Seesion是独立存储的. 4.在整个会话过程中,只要SessionID的cookie不丢失,都会保存Session信息的. 5.Sessi

ASP.NET动态设置页面标题的方法详解_实用技巧

  ASP.NET为我们提供了一个控件类:System.Web.UI.HtmlControls.HtmlGenericControl.它可以实现HTML的元素的一个实例,比如在.cs代码中控制aspx中的<td>元素(注意,它不是<ASP:TableCell>).我们知道,页面标题是被包含在<TITLE></TITLE>中的,而<TITLE>也是一个HTML的元素,所以,我们就可以利用System.Web.UI.HtmlControls.Html

ASP.NET中readonly与const的区别详解_实用技巧

const是一个修饰常量的关键字,它限定一个变量不允许被改变.使用const在一定程度上可以提高程序的安全性和可靠性,它在程序设计中有着非常重要的作用,给开发人员带来非常方便的应用. 下面我们来建一个控制台应用程序作测试: public class Test { public readonly string name = "George"; public const string coname = "ABC Company LLC"; public Test(str

asp.net Repeater 数据绑定的具体实现(图文详解)_实用技巧

以下为设计步骤: 1.在C# 中连接数据库.如下图:2.在项目中添加新建项,建立一个数据集,并把Categories从服务器资源列表中拖到这个数据集模板中并点击菜单"生成-生成解决方案",如下图: 3.在aspx的webform上放一个ObjectDataSource控件,设定它的TypeName为刚刚建立的数据集类型,用它的向导建立即可.4.在aspx的webform上放一个Repeater控件,用它的向导设定它的DataSourceID为上面的ObjectDataSource5.在

asp.net类序列化生成xml文件实例详解_实用技巧

本文实例讲述了asp.net类序列化生成xml文件的方法.分享给大家供大家参考,具体如下: 根据设计的需求需要开发多个商品的API 原XML文件如下: <urlset> <url> <loc>http://www.xxxxx.com/todaydetials.aspx?id=143</loc> <data> <display> <website>爱购114</website> <siteurl>ht

Asp.net,C# 加密解密字符串的使用详解_实用技巧

首先在web.config | app.config 文件下增加如下代码: 复制代码 代码如下: <?xml version="1.0"?>  <configuration>    <appSettings>      <add key="IV" value="SuFjcEmp/TE="/>      <add key="Key" value="KIPSToILG