首页 > 编程 > .NET > 正文

扩展ASP.NET内置GridView控件之一

2024-07-10 13:12:14
字体:
来源:转载
供稿:网友

  本文bilal haidar详细解释如何扩展asp.net2.0内置的gridview控件,同样还将解释了扩展后的gridview控件所具有的新的重要特征:基于行的上下文菜单和gridviews行的过滤功能。

  引言

  本文将聚焦对asp.net2.0内置的gridview进行扩展的一系列新功能。其中本文介绍两个主要特征:基于行的上下文菜单(row_base contextmenu)和基于过滤功能的gridview的行,在上周我曾经介绍了gridview控件。

  在我们自定义的gridview控件里,提供了几个具有“高效率”功能的扩展,不过,这些功能都不是gridview控件自带的基本功能,正如您即将看到的,我们需要要重构这些功能。 扩展现在的gridview控件可以让您更能够控件常规gridview所没有的功能,另外,扩展该功能后,您以后就可以不断重复的使用这些新特性。

  我们准备增加如下几个特征:

  1、行的单击

  2、行的双击

  3、基于行的上下文菜单

  4、头元素的升序降序排列

  5、当页面记录树木小于pagesize时,修正gridview的高度

  6、内置的过滤文本框

  7、内置的复选框

  除此以外,我们还将添加三个简单按钮,可以利用他们在客户端添加一些简单的确认函数

  ·确认按钮(confirm button)

  ·图片按钮(confirm image button)

  ·链接按钮(confirm link button)

  扩展的xgrid控件需要从gridview控件派生,这也就说这个新的控件可以在asp.net2.0上运行。

  下面代码显示了扩展后的的开始部分:

namespace customcontrols
{
 namespace grid
 {
  [toolboxdata("<{0}:xgrid runat=server></{0}:xgrid>")]
  public partial class xgrid : gridview
  {

  要使用这个控件,只要简单的把它通过vs.net2005的工具栏直接拖放到web窗体上即可。具体怎把该控件添加vs.net2005工具栏上则不是本文讨论的范围。

  下面的代码片断显示了它的基本使用

<xgrid:xgrid id="xgrid1" runat="server" autogeneratecolumns="false" />

  单击(single row click)

  这是该自定义控件添加的第一个新特性,您现在把鼠标放置到一行数据上然后单击就会引起页面数据的回发,你可能认为使用这个功能实现主/从页面,是的,使用rowclick可以实现这个功能。

  相关的属性是:

  ·enablerowclick:这个属性可以取值为true/false,默认为false

  ·mouseovercolor:当enablerowclick设置为true时,利用该属性设置鼠标移过一行数据显示的结果。单击和双击都使用这个功能。

  下图显示了运行结果,在这个运行结果里,显示了单击一行时的效果。


  您可以在rowclick事件里处理单击的结果,示意代码如下:

protected void xgrid1_rowclick(object sender, rowclickeventargs e)
{
 response.write("you clicked row: " + e.gridviewrow.rowindex);
}

  rowclickeventargs参数默认是从eventargs 类派生,并增加了一个名称为gridviewrow 的属性,这样您就可以使用该属性获取当前行的索引。

  行的双击(double row click)

  这是往扩展gridview添加的第二个功能。您现在只需要在一行上双击就会向服务器产生数据回发来处理请求。您可以通过双击让当前行处于编辑默认。 在行的双击里已经添加了rowdoubleclick事件,您可以使用该事件处理特定的业务逻辑

  相关的属性

  enablerowdoubleclick:取值为true或者false,默认值为false

  mouseovercolor:当enablerowdoubleclick设置为true时,可以利用该属性设置设置鼠标移过行的效果,这个和单击行的效果一样。

  下图显示了运行结果


  您可以处理rowdoubleclick 事件,示意代码如下:

protected void xgrid1_rowdoubleclick(object sender, rowdoubleclickeventargs e)
{
 response.write("you double clicked row: " + e.gridviewrow.rowindex);
}

  rowdoubleclickeventargs 类时从eventargs 类派生并添加了gridviewrow 属性,使用该属性可以给你更全的控件

  基于行的上下文菜单

  我们花费了一个半月左右的事件来研究gridview控件,但是我们发现没有一个gridview控件可以使用contextmenu,也就是说内置的gridview上下文菜单控件无法使用。

  我们不得不使用dino esposito开发的context meun,该菜单的开发文档发布在msdn杂志上,本文后面会在资料文件里列出对该文件的链接。 dino esposito开发的context menu主要使用asp.net1.1技术进行开发,我们已经建立了基于asp.net2.0 context menu项目,该项目拷贝了他的代码,并进行了简单的更改。其中,一个改变是在context menu项目里添加了onclientclick属性,这样在处理客户端向服务器请求的回发前,开发人员可以将客户端处理事件挂接到上下文菜单里。

  context menu使用的客户端代码主要是javascript代码,这里的代码在asp.net2.0里已经作为资源(resource)包括进去了。

  context menu现在已经是基于asp.net2.0的项目了并且已经集成到扩展的gridview控件的每一行,现在当您右击每一行时,您将可以访问右击事件。扩展的gridview控件还有一个新的属性:rightclickrow,该属性可以返回当前行上下文菜单

  相关的属性如下:

  ·gridview控件是具有上下文菜单的,这里的id设置的就是在aspx页面上的gridview控件id

  ·rightclickedrow:该属性设置上下文菜单。

  下图显示了运行结果。


  当您在行上单击鼠标右键时弹出context menu菜单。这里显示了三个选项:

  ·add a new row:当选择该选项后,将会在记录里出现新建行。

  ·delete row:允许你删除当前右击的行

  ·edit row:运行您设置当前行的模式 为编辑模式

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表