asp.net 3.5 中MVC Gridview控件的开发

4.3  GridView控件开发

4.3.1  GridView控件的基本功能

数据显示控件——GridView的运行界面,如图4-2所示。

从图中可以看出,GridView控件具有分页、排序功能,单击GridView控件下方的分页链接,可以显示指定页面的数据。在分页功能中,最左边是“前一页”链接,最右边则是“后一页”链接,并显示最前面的两个页面及最后面的两个页面,页面的导航功能比较强大。

单击GridView控件上方相关的字段链接,可以对该字段实现排序,如图4-3所示。

 

图4-2  GridView控件的运行界面

图4-3  GridView控件的排序

图4-3是对字段“City”实现排序后的结果,在GridView控件的最右边,还显示了每条记录所对应的“Edit”链接和“Delete”链接,单击“Edit”链接,就会转到相关的数据编辑页面;单击“Delete”链接,就会删除指定的数据。

4.3.2  构建分页列表

为了对需要显示的数据,构建功能较为强大的分页功能,这里构建了一个泛型的分页列表——PagedList<T>类,用于表示分页的基本数据,PagedList<T>类的UML类图如图4-4所示。

图4-4  PagedList<T>的UML类图

从图4-4中可以看出,为实现分页功能,这里定义了分页的几个基本属性,它们分别是页面索引PageIndex(表示当前页面)、一个页面中所显示的数据记录数量PageSize、数据的总记录数量TotalItemCount及总的页面数量TotalPageCount,还定义了SortExpression属性,用于表示需要排序的字符串,IdentityColumnName属性主要表示数据表中的主键字段的名称,以便实现相关的编辑、删除等操作。

PagedList<T>类的实现代码,见代码清单4-5

代码清单4-5  PagedList<T>的实现代码

 1: public class PagedList<T> : List<T>

 2: {

 3:   public PagedList(IEnumerable<T> items, int pageIndex, int pageSize,

                                 int totalItemCount,string identityColumnName,

                                 string sortExpression)

 4:   {

 5:     this.AddRange(items);

 6:     this.PageIndex = pageIndex;

 7:     this.PageSize = pageSize;

 8:     this.SortExpression = sortExpression;

 9:     this.TotalItemCount = totalItemCount;

10:     this.TotalPageCount = (int)Math.Ceiling(

                                              totalItemCount / (double)pageSize);

11:     this.IdentityColumnName = identityColumnName;

12:   }

13:

14:   public int PageIndex { get; set; }

15:   public int PageSize { get; set; }

16:   public string SortExpression { get; set; }

17:   public int TotalItemCount { get; set; }

18:   public int TotalPageCount { get; private set; }

19:   public string IdentityColumnName { get; set; }

20: }

上述代码的实现较为简单,第14行到第19行分别定义了6个属性的读写器,这是C# 3.0中读写器的写法。

代码第3行到第12行定义了PagedList<T>类的构造函数,主要实现列表中元素的添加,以及6个属性的初始化。

4.3.3  构建LINQ查询的扩展方法

ASP.NET 3.5中,开发者可以使用LINQ关键技术,非常方便地实现各种数据的查询,为实现将LINQ的数据查询结果显示在GridView控件中,可以采用构建LINQ查询的扩展方法,这里构建了一个PageLinqExtensions类,PageLinqExtensions类的UML类图如图4-5所示。

图4-5  PageLinqExtensions的UML类图

从图中可以看出,针对LINQ查询及List类型数据实现了3个重载的扩展方法,通过设置页面索引PageIndex、页面大小PageSize、排序字符串SortExpression及主键字段名称IdentityColumnName,使得LINQ的查询数据(IQueryable)或者List类型的数据是分页列表PagedList<T>类的实例化对象,具有分页功能。

PageLinqExtensions类的实现代码,见代码清单4-6

代码清单4-6  PageLinqExtensions的实现代码

 1: public static class PageLinqExtensions

 2: {

 3:   public static PagedList<T> ToPagedList<T>(

                 this IQueryable<T> allItems,

                 int? pageIndex,

                 int pageSize)

 4:   {

 5:     return ToPagedList<T>(allItems, pageIndex, pageSize,null,

                                        String.Empty);

 6:   }

 7:

 8:   public static PagedList<T> ToPagedList<T>(

                 this IQueryable<T> allItems,

                 int? pageIndex,

                 int pageSize,

                 string identityColumnName)

 9:   {

10:    return ToPagedList<T>(allItems, pageIndex, pageSize,

                                        identityColumnName, String.Empty);

11:   }

12:

13:   public static PagedList<T> ToPagedList<T>(

                 this IQueryable<T> allItems,

                 int? pageIndex,

                 int pageSize,

                 string identityColumnName,

                 string sort)

14:   {

15:     var truePageIndex = pageIndex ?? 0;

16:     var itemIndex = truePageIndex * pageSize;

17:     var pageOfItems = allItems.Skip(itemIndex).Take(pageSize);

18:     var totalItemCount = allItems.Count();

19:

20:     return new PagedList<T>(pageOfItems, truePageIndex, pageSize,

                                  totalItemCount,identityColumnName, sort);

21:   }

22:

23: }

在上述代码中,对LINQ的查询数据IQueryable<T>对象,定义了3个重载的扩展方法ToPagedList<T>,它们分别是3行到第6行的扩展方法,其中有输入当前页面pageIndex和页面大小pageSize;8行到第11行的扩展方法,其中有输入当前页面pageIndex、页面大小pageSize及主键字段名称identityColumnName;13行到第21行的扩展方法,其中有输入当前页面pageIndex、页面大小pageSize、主键字段名称identityColumnName及排序的字符串。

通过定义PageLinqExtensions类,使得LINQ的查询数据IQueryable<T>对象可以使用ToPagedList<T>()方法,使得LINQ的查询数据具有分页、排序功能。

4.3.4  构建GridViewOption类

为了让GridView控件具有编辑、删除链接,这里专门创建了一个GridViewOption类,其UML类图如图4-6所示。

图4-6  GridViewOption的UML类图

在GridViewOption类中,定义了表头的显示文字Columns,编辑、删除链接的相关属性,例如,是否显示编辑链接ShowEditButton、编辑链接的文字EditButtonText及编辑功能的动作方法EditAction等。

GridViewOption类的实现代码,见代码清单4-7

代码清单4-7  GridViewOption的实现代码

 1: public class GridViewOption

 2: {

 3:   private bool  showEditButton = true;

 4:   private bool  showDeleteButton = true;

 5:

 6:   private string  editButtonText = "Edit";

 7:   private string  deleteButtonText = "Delete";

 8:

 9:   private string  editAction = "Edit";

10:   private string  deleteAction = "Delete";

11:

12:   public bool ShowEditButton

13:   {

14:      get { return  showEditButton; }

15:      set {  showEditButton = value; }

16:   }

17:

18:   public bool ShowDeleteButton

19:   {

20:      get { return  showDeleteButton; }

21:      set {  showDeleteButton = value; }

22:   }

23:

24:   public string EditButtonText

25:   {

26:      get { return  editButtonText; }

27:      set {  editButtonText = value; }

28:   }

29:

30:   public string DeleteButtonText

31:   {

32:      get { return  deleteButtonText; }

33:      set {  deleteButtonText = value; }

34:   }

35:

36:   public string EditAction

37:   {

38:      get { return  editAction; }

39:      set {  editAction = value; }

40:   }

41:

42:   public string DeleteAction

43:   {

44:      get { return  deleteAction; }

45:      set {  deleteAction = value; }

46:   }

47:

48:   private string[] columns;

49:

50:   public string[] Columns

51:   {

52:      get { return columns  ; }

53:      set { columns= value; }

54:   }

55: }

上述的代码实现也比较简单,主要定义了7个基本属性的读写器,而且这7个属性还具有默认值。也就是说,在默认情况下,是显示“Edit”、“Delete”链接的,它们的动作方法名称分别为Edit和Delete。

开发者如果需要改变这些默认值,只需要重新设置GridViewOption类中的相关属性即可。

4.3.5  构建GridViewHelper类

在实现了LINQ查询数据的分页、排序功能,定义了编辑、删除链接的相关属性之后,此时就需要专门实现GridView控件,也就是说,需要对HtmlHelper类实现相关的扩展方法,从而实现GridView控件的输出。

这里专门定义了一个GridViewHelper类,它的UML类图如图4-7所示。

图4-7  GridViewHelper的UML类图

GridViewHelper类中,定义了3个重载的GridView<T>扩展方法,通过设置模型数据、显示字段,以及编辑、删除链接等参数,即可显示功能较为强大的GridView数据结果。

GridViewHelper类的实现代码,见代码清单4-8

代码清单4-8  GridViewHelper的实现代码

 1: public static class GridViewHelper

 2: {

 3:   public static string GridView<T>(this HtmlHelper helper)

 4:   {

 5:      return GridView<T>(helper, null, null,new GridViewOption());

 6:   }

 7:

 8:   public static string GridView<T>(this HtmlHelper helper, object data)

 9:   {

10:      return GridView<T>(helper, data, null,new GridViewOption());

11:   }

12:

13:   public static string GridView<T>(this HtmlHelper helper, object data,

                             string[] columns, GridViewOption options)

14:   {

15:      var items = (IEnumerable<T>)data;

16:      if (items == null)

17:        items = (IEnumerable<T>)helper.ViewData.Model; 

18:

19:      if (columns == null)

20:        columns = typeof(T).GetProperties().Select(p => p.Name)

                                     .ToArray();

21:

22:      var writer = new HtmlTextWriter(new StringWriter());

23:      writer.RenderBeginTag(HtmlTextWriterTag.Table);

24:

25:      writer.RenderBeginTag(HtmlTextWriterTag.Thead);

26:      RenderHeader(helper, writer, columns, options);

27:      writer.RenderEndTag();

28:

29:      string identityColumnName= ((PagedList<T>)items)

                                                  .IdentityColumnName ;

30:

31:      writer.RenderBeginTag(HtmlTextWriterTag.Tbody);

32:      foreach (var item in items)

33:        RenderRow<T>(helper, writer, columns, item, identityColumnName,

                                 options);

34:      writer.RenderEndTag();

35:

36:      RenderPagerRow<T>(helper, writer, (PagedList<T>)items,

                                 columns.Count());

37:

38:      writer.RenderEndTag();

39:

40:      return writer.InnerWriter.ToString();

41:   }

42:

43:   private static void RenderHeader(HtmlHelper helper,

             HtmlTextWriter writer, string[] columns, GridViewOption options)

44:   {

45:      writer.RenderBeginTag(HtmlTextWriterTag.Tr);

46:      foreach (var columnName in columns)

47:      {

48:        writer.RenderBeginTag(HtmlTextWriterTag.Th);

49:        var currentAction = (string)helper.ViewContext

                                                        .RouteData.Values["action"];

50:        string link=null;

51:        if (options.Columns == null)

52:          link = helper.ActionLink(columnName, currentAction,

                                                  new { sort = columnName });

53:        else {

54:           link = helper.ActionLink(options.Columns[i], currentAction,

                            new { sort = columnName });

55:            i++; }

56:        writer.Write(link);           

57:        writer.RenderEndTag();  }

58:      bool showEditColumn = options.ShowEditButton ||

                                         options.ShowDeleteButton;

59:      if (showEditColumn){

60:        writer.RenderBeginTag(HtmlTextWriterTag.Th);

61:        writer.Write(helper.Encode(""));

62:        writer.RenderEndTag(); }           

63:      writer.RenderEndTag();

64:   }

65:

66:   private static void RenderRow<T>(HtmlHelper helper,

             HtmlTextWriter writer, string[] columns, T item ,

             string identityColumnName, GridViewOption options)

67:   {

68:      writer.RenderBeginTag(HtmlTextWriterTag.Tr);

69:      foreach (var columnName in columns)

70:      {

71:        writer.RenderBeginTag(HtmlTextWriterTag.Td);

72:        var value = typeof(T).GetProperty(columnName)

                                       .GetValue(item, null) ?? String.Empty;

73:        writer.Write(helper.Encode(value.ToString()));  

74:        writer.RenderEndTag();

75:        }

76:

77:      bool showEditColumn = options.ShowEditButton ||

                                         options.ShowDeleteButton;

78:

79:      if (showEditColumn)

80:      {

81:        var identityVaule = typeof(T).GetProperty(identityColumnName)

                                                  .GetValue(item, null);

82:        writer.RenderBeginTag(HtmlTextWriterTag.Td);

83:

84:        if ( options.ShowEditButton)

85:        {

86:          var link = helper.ActionLink(options.EditButtonText,

                              options.EditAction , new { id =identityVaule });

87:          writer.Write(link);

88:          writer.Write(" "); 

89:        }

90:

91:        if (options.ShowDeleteButton )

92:        {

93:          var link = helper.ActionLink(options.DeleteButtonText,

                             options.DeleteAction , new { id = identityVaule });

94:          writer.Write(link);            

95:        }

96:        writer.RenderEndTag();

97:      }

98:      writer.RenderEndTag();

99:   }

100:

 

101:   private static void RenderPagerRow<T>(HtmlHelper helper,

             HtmlTextWriter writer, PagedList<T> items, int columnCount)

102:   {

103:     int nrOfPagesToDisplay = 10;

104:

105:     if (items.TotalPageCount == 1)

106:       return;

107:

108:     writer.RenderBeginTag(HtmlTextWriterTag.Tr);

109:     writer.AddAttribute(HtmlTextWriterAttribute.Colspan,

                                          columnCount.ToString());

110:     writer.RenderBeginTag(HtmlTextWriterTag.Td);

111:     var currentAction = (string)helper.ViewContext.RouteData

                                                       .Values["action"];

112:

113:     if (items.PageIndex >= 1)

114:     {

115:       var linkText = String.Format("{0}", "<<<");

116:       var link = helper.ActionLink(linkText, currentAction,

                 new { page = items.PageIndex, sort = items.SortExpression });

117:       writer.Write(link + "&nbsp;");

118:     }

119:

120:     int start = 0;

121:     int end = items.TotalPageCount;

122:

123:     if (items.TotalPageCount > nrOfPagesToDisplay)

124:     {

125:       int middle = (int)Math.Ceiling(nrOfPagesToDisplay / 2d) - 1;

126:       int below = (items.PageIndex - middle);

127:       int above = (items.PageIndex + middle);

128:

129:       if (below < 4)

130:       {

131:         above = nrOfPagesToDisplay;

132:         below = 0;

133:       }

134:       else if (above > (items.TotalPageCount - 4))

135:       {

136:         above = items.TotalPageCount;

137:         below = (items.TotalPageCount - nrOfPagesToDisplay);

138:       }

139:

140:       start = below;

141:       end = above;

142:     }

143:

144:     if (start > 3)

145:     {

146:       var linkText = String.Format("{0}", "1");

147:       var link = helper.ActionLink(linkText, currentAction,

                             new { page = 1, sort = items.SortExpression });

148:       writer.Write(link + "&nbsp;");

149:

150:       linkText = String.Format("{0}", "2");

151:       link = helper.ActionLink(linkText, currentAction,

                        new { page = 2, sort = items.SortExpression });

152:       writer.Write(link + "&nbsp;");

153:       writer.Write(String.Format("{0}", "..."));

154:     }

155:

156:     for (var i = start; i < end; i++)

157:     {

158:       if (i == items.PageIndex)

159:       {

160:         writer.Write(String.Format("<strong>{0}</strong>&nbsp;",

                                      i + 1));

161:       }

162:       else

163:       {

164:         var linkText = String.Format("{0}", i + 1);

165:         var link = helper.ActionLink(linkText, currentAction,

                                new { page = i + 1, sort = items.SortExpression });

166:         writer.Write(link + "&nbsp;");

167:       }

168:     }

169:

170:     if (end < (items.TotalPageCount - 3))

171:     {

172:       writer.Write(String.Format("{0}", "..."));

173:       var linkText = String.Format("{0}", items.TotalPageCount - 1);

174:       var link = helper.ActionLink(linkText, currentAction,

                              new { page = items.TotalPageCount - 1,

                                        sort = items.SortExpression });

175:       writer.Write(link + "&nbsp;");

176:

177:       linkText = String.Format("{0}", items.TotalPageCount);

178:       link = helper.ActionLink(linkText, currentAction,

                        new { page = items.TotalPageCount,

                                  sort = items.SortExpression });

179:       writer.Write(link + "&nbsp;");

180:     }

181:

182:     if (items.PageIndex + 2 <= items.TotalPageCount)

183:     {

184:       var linkText = String.Format("{0}", ">>>");

185:       var link = helper.ActionLink(linkText, currentAction,

                             new { page = items.PageIndex + 2,

                                       sort = items.SortExpression });

186:       writer.Write(link + "&nbsp;");

187:     }

188:

189:     writer.RenderEndTag();

190:     writer.RenderEndTag();

191:   }

192: }

上述的代码比较长,不过可以分为4个部分,它们分别是第1部分的第3行到第41行、第2部分的第43行到第64行、第3部分的第66行到第99行及第4部分的第101行到第191行。

1部分是代码的主要部分,其中定义了3个重载的GridView<T>扩展方法。在3行到第6行的扩展方法中,不需要输入任何参数;在8行到第11行的扩展方法中,需要输入模型数据参数;而在13行到第41行的扩展方法中,则需要输入模型数据、显示数据字段,以及编辑、删除等相关设置。

在扩展方法中,如果没有输入模型数据,代码第17行会通过HtmlHelper类,自动获取视图ViewData中的模型数据Model;如果没有输入需要显示的数据字段,代码第20行会自动获得指定数据表的所有字段名称。

代码第22行创建HtmlTextWriter类的一个实例化对象writer,以便构建显示数据表格的HTML语句,其中第26行构建数据表的表头,第29行获得数据表中的主键字段,而代码第33行则实现数据显示的HTML语句,第36行代码构建分页界面的HTML语句。

2部分代码主要实现数据表的表头。第45行构建表格中的多行标记,第48行则构建表格中的多列标记。第51行到第57行,用于设置表头的字段;第59行到第63行,则根据用户对编辑、删除的相关设置,判断是否显示相对应的空白表头。

3部分代码主要实现数据表的数据显示。其中第68行到第75行显示数据表的数据,第79行到第97行用于显示数据的编辑、删除链接。

4部分代码主要实现数据页码的显示。其中第103行设置页码显示的个数为10,第105行判断总的页码数量,如果仅为一个页面,则在106行直接退出。第113行到第118行显示最左边的页码显示部分“<<<”; 第123行到第138行计算需要显示页码的开始和结束部分;第144行到第154行显示左边的页码省略部分“…”;第156行到第168行显示中间部分的页码;第170行到第180行显示右边的页码省略部分“…”;第182行到第187行显示最右边的页码显示部分“>>>”。

4.3.6  LINQ动态查询

LINQ是ASP.NET 3.5所提供的一种新的查询语言,开发者可以利用LINQ非常方便地构建类型安全的查询语句,例如如下语句:

var model = (from c in db.Customers select c).OrderBy(c=>c.CompanyName);

针对数据表Customers查询所有的字段,并且按照CompanyName字段排序,在实现查询的排序功能时,这里采用了Lambda表达式,实际上是一种静态的排序,也就是说,不能实现参数化的字段排序,即LINQ动态查询。

微软公司的LINQ开发团队,为了让开发者实现LINQ动态查询,即提供字符串形式的参数,专门开发了实现LINQ动态查询的类库——DynamicLibrary。

开发者可以免费使用这个类库DynamicLibrary,轻松实现LINQ动态查询,代码如下:

var model = (from c in db.Customers select c).OrderBy(sort);

在上述代码中,排序字段中输入了字符串参数sort变量,实现了LINQ的参数化,即动态排序。

关于类库DynamicLibrary的其他使用方法,请参照相关的文档说明。

4.3.7  GridView的使用方法

在使用GridView控件时,需要在控制器中设置分页、排序参数,在视图中设置编辑、删除等链接选项,以下分别予以说明。

1.控制器中设置分页、排序参数

GridView中分页、排序参数的设置,是在控制器相关的方法中实现的,例如如下代码:

var model1 = (from c in db.Customers select c).OrderBy(sort)

                   .ToPagedList(page, 5,"CustomerID", sort);

在上述代码中,排序字段中输入了字符串参数sort变量,实现了LINQ的动态排序,然后通过ToPagedList()扩展方法,设置了当前页面page、页面显示数为5、数据表主键字段“CustomerID”及排序参数sort

2.视图中设置编辑、删除选项

在视图页面中,代码设置如下:

<% =Html.GridView<Customers>(Model, new string[] { "CustomerID",

                      "CompanyName", "ContactName", "Address", "City" }),

                      new GridViewOption()   %>

在上述代码中,由于显示的是数据表Customers中的数据,因此GridView控件的类型为Customers,其中传入了两个参数,它们分别是模型数据Model和需要显示的数据字段,上述代码的运行界面如图4-8所示。

图4-8  GridView控件的运行界面

如果需要修改编辑、删除链接的文字显示等,可以设置如下的代码:

<% =Html.GridView<Customers>(Model, new string[] { "CustomerID",

              "CompanyName", "ContactName", "Address", "City" },

   new GridViewOption() { EditButtonText="编辑",DeleteButtonText ="删除"  })

%>

上述代码设置了编辑、删除链接的文字分别为“编辑”和“删除”,其运行界面如图4-9所示。

 

图4-9  GridView控件的编辑、删除链接设置

如果需要修改表格头部字段的文字显示等,可以设置如下的代码:

<% =Html.GridView<Customers>(Model,

               new string[] { "CustomerID", "CompanyName", "ContactName",

                                  "Address", "City" },

             new GridViewOption() { EditButtonText = "编辑",

                     DeleteButtonText = "删除",

         Columns =new string[]  {"编号" ,"公司名称", "联系人", "地址", "城市"} })

%>

在上述代码中,通过GridViewOption类中的Columns属性设置了表格头部的文   字分别为“编号”、“公司名称”、“联系人”、“地址”和“城市”,其运行界面如图4-10所示。

图4-10  GridView控件的表格头部设置

这里需要说明的是,Columns属性要与其前面所设置的显示字段一致。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 3
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值