登录/ 注册
 找回密码
 立即注册
关闭

CSDN热搜

程序园 精品问答 技术交流 资源下载
返回列表 发新帖
首页 › 业界区 › 业界 ›为视图自定义辅助方法（上）

为视图自定义辅助方法（上）

寇秀娟 2025-5-30 01:04:16
在编写ASP.NET MVC应用程序时，只依赖内置的视图辅助方法很难达到很高的生产力，即使是定义在MvcFutures中的补充类库，也很难满足项目的具体需求。此外，不同的项目有不同的特点，在很多时候也需要定义较为特殊的辅助方法，使开发人员能够更快，更方便地写出更容易维护的代码。这也是自定义视图辅助方法最主要的目的（没有之一）。而这次的文章，便是给出一个这方面的示例，可作为此类问题的一个参考。
预备

在编写客户端HTML时，进行客户端验证是最常见的工作之一。既然ASP.NET MVC集成了jQuery类库，那么我们不妨基于jQuery的Validate插件编写这部分功能。假设有如下表单：
  1. <form method="post" action="" id="form">
  2.     <p>
  3.         <span>Name: </span>
  4.         <input type="text" name="user.Name" />
  5.     </p>
  6.     <p>
  7.         <span>Age: </span>
  8.         <input type="text" name="user.Age" />
  9.     </p>
  10.     <p>
  11.         <span>Email:</span>
  12.         <input type="text" name="user.Email" />
  13.     </p>
  14.     <input type="submit" value="Submit" />
  15. </form>
复制代码
如果使用JQuery Validate插件进行客户端校验，那么我们可以编写如下代码：
  1. [/code]以上这段脚本的作用便是告诉jQuery校验哪个表单，对表单中的各个元素分别采取哪种校验方式，以及在发生错误的时候该提示什么信息（详细内容可查阅文档）。这里可能需要补充一段题外话。实际上jQuery.Validate非常灵活，可以有各种方式提供校验信息，例如直接为html元素加特殊标记。不过老赵认为那些方法的trick意味太浓，且不容易编写辅助方法协助开发，因此刻意忽略那些方式。
  2. 这样的结果可能会招一些前台开发人员欢喜，不过老赵觉得，至少有三个地方需要提高：
  3. [list=1]
  4. [*]数据分散，提高维护难度。例如HTML元素和校验规则分离，校验规则
  5. [*]对于开发人员来说，编写JSON较不方便，容易发生错误。
  6. [*]缺少对于“自动校验”的支持，需要完全手写。
  7. [/list]而我们编写的辅助方法，主要就是面向前两点，而最后一点可以说是自然而然的事情。
  8. [size=6]入口[/size]
  10. 任何方法都需要一个入口，这个入口可能是某个静态类，甚至直接定义在global下最直接的“方法”。而ASP.NET MVC视图的辅助方法的入口往往定义在ViewPage中。例如与HTML相关的辅助方法定义在ViewPage.Html属性下，而与URL相关的辅助方法都定义在ViewPage.Url属性下（ViewUserControl和ViewMasterPage情况也一样）。这样的入口区分，其实也是为辅助方法进行了分类，也让用户可以在IDE的帮助下快速定位到所需的辅助方法。在编写一些简单的自定义辅助方法时，我们可以利用C# 3.0的扩展方法特性，将方法定义在HtmlHelper和UrlHelper上，这样便可直接在页面上使用。而对于一些特殊情况，例如目前的状况，我们便需要重新定义一个入口，以便我们的辅助方法可以以此作为基础进行扩展。为此，我们把这一重担交给JQueryHelper类：
  11. [code]public class JQueryHelper
  12. {
  13.     public JQueryHelper(ViewContext viewContext, ViewPage page)
  14.         : this(viewContext, page, RouteTable.Routes)
  15.     { }
  17.     public JQueryHelper(
  18.         ViewContext viewContext,
  19.         ViewPage page,
  20.         RouteCollection routeCollection)
  21.     {
  22.         this.ViewContext = viewContext;
  23.         this.Page = page;
  24.         this.RouteCollection = routeCollection;
  25.     }
  27.     public RouteCollection RouteCollection { get; private set; }
  29.     public ViewContext ViewContext { get; private set; }
  31.     public ViewPage Page { get; private set; }
  32. }
复制代码
生成JQueryHelper对象时，我们会保留目前的上下文，让各种扩展方法自行选用。至于保留哪些成员，这并没有太多限制，一般来说够用便可，如有不足，我们按需补充便是。接下来便是要让页面可以访问到这个辅助对象了，与Html和Url这些现有的入口不同，我们使用扩展方法，而不是属性来提供入口。这样做的好处便是在毫无侵入的情况，提供了较为友好的语法，这也是扩展方法的美妙之处：
  1. public static class JQueryExtensions
  2. {
  3.     public static JQueryHelper JQuery(this ViewPage page)
  4.     {
  5.         var key = typeof(JQueryHelper);
  6.         var jquery = page.Items[key] as JQueryHelper;
  8.         if (jquery == null)
  9.         {
  10.             page.Items[key] = jquery = new JQueryHelper(page.ViewContext, page);
  11.         }
  13.         return jquery;
  14.     }
  15. }
复制代码
ViewPage的Items属性是一个页面级别的存储容器，可以使用键/值的方式存放任意数据，我们这里便利用这个特性，为每个页面提供唯一的JQueryHelper对象。
校验

因为一个页面可能有多个需要校验的区域，因此我们需要提供一个机制，能够保存多个“批次”的校验信息。于是，我们编写一个JQueryValidation类用来存放“一批”校验信息：
  1. public class JQueryValidation
  2. {
  3.     public JQueryValidation(ViewPage page)
  4.     {
  5.         this.Page = page;
  6.     }
  8.     public ViewPage Page { get; private set; }
  10.     ...
  11. }
复制代码
当然，在JQueryHelper这个入口上，需要有一个访问校验信息的方式。在这里，我们使用字符串来标识“一批”校验信息。此外，我们也提供了默认重载以方便某些简单场景下的使用：
  1. public static class JQueryValidationExtensions
  2. {
  3.     public static JQueryValidation Validate(this JQueryHelper jquery)
  4.     {
  5.         return jquery.Validate("(default)");
  6.     }
  8.     public static JQueryValidation Validate(this JQueryHelper jquery, string name)
  9.     {
  10.         var key = typeof(JQueryValidation) + "+" + name;
  11.         var page = jquery.Page;
  12.         var validation = page.Items[key] as JQueryValidation;
  14.         if (validation == null)
  15.         {
  16.             page.Items[key] = validation = new JQueryValidation(page);
  17.         }
  19.         return validation;
  20.     }
  21. }
复制代码
作了那么多的铺垫，接下来便是最关键辅助方法编写了。通过对JavaScript代码进行分析之后，我们决定采用典型的“记录 - 汇总”模式来编写这个方法1。“记录 - 汇总”模式的原则便是通过“记录”将信息汇总后输出，在作为页面辅助方法时，我们可以在任何地方“记录”校验信息，然后在合适的地方输出一段汇总后的脚本。由于我们所需要的JavaScript非常规整，因此实现这个需求并不困难。
首先是记录，对于每个
  1. public class JQueryValidation
  2. {
  3.     private Dictionary<string, Dictionary<string, object>> m_rules =
  4.         new Dictionary<string, Dictionary<string, object>>();
  6.     private Dictionary<string, Dictionary<string, string>> m_messages =
  7.         new Dictionary<string, Dictionary<string, string>>();
  9.     private void AddRuleAndMessage(string name, string rule, object value, string m
  10.     {
  11.         if (!this.m_rules.ContainsKey(name))
  12.             this.m_rules[name] = new Dictionary<string, object>();
  13.         this.m_rules[name][rule] = value;
  15.         if (!String.IsNullOrEmpty(message))
  16.         {
  17.             if (!this.m_messages.ContainsKey(name))
  18.                 this.m_messages[name] = new Dictionary<string, string>();
  19.             this.m_messages[name][rule] = message;
  20.         }
  21.     }
  23.     public void Required(string name, string message)
  24.     {
  25.         this.AddRuleAndMessage(name, "required", true, message);
  26.     }
  28.     public void Email(string name, string message)
  29.     {
  30.         this.AddRuleAndMessage(name, "email", true, message);
  31.     }
  33.     public void Number(string name, string message)
  34.     {
  35.         this.AddRuleAndMessage(name, "number", true, message);
  36.     }
  38.     public void Range(string name, int min, int max, string message)
  39.     {
  40.         this.AddRuleAndMessage(name, "range", new int[] { min, max }, message);
  41.     }
  43.     ...
  44. }
复制代码
我们使用两个字典分别存放规则的描述（m_rules）与错误提示（m_messages），由于信息的统一，我们只需编写一个AddRuleAndMessage方法便可满足所有需要，而其他的方法只是定义了一个良好的接口，然后简单地把信息委托给AddRuleAndMessage而已。
最后便是汇总，我们使用JavaScriptSerializer把规模的描述与错误提示序列化成JSON字符串并输出：
  1. public string ToScripts(string form)
  2. {
  3.     JavaScriptSerializer serializer = new JavaScriptSerializer();
  4.     StringBuilder builder = new StringBuilder();
  6.     builder.Append("$(");
  7.     serializer.Serialize(form, builder);
  8.     builder.Append(").validate(");
  9.     serializer.Serialize(
  10.         new
  11.         {
  12.             rules = this.m_rules,
  13.             messages = this.m_messages,
  14.             onkeyup = false
  15.         }, builder);
  16.     builder.Append(");");
  18.     return builder.ToString();
  19. }
复制代码
使用

“记录 - 汇总”，无它耳。
  1. <form method="post" action="" id="form">
  2.     <p>
  3.         <span>Name: </span>
  4.         <input type="text" name="user.Name" />
  5.         <% this.JQuery().Validate().Required("user.Name", "please provide your name!!!"); %>
  6.     </p>
  7.     <p>
  8.         <span>Age: </span>
  9.         <input type="text" name="user.Age" />
  10.         <% this.JQuery().Validate().Required("user.Age", null); %>
  11.         <% this.JQuery().Validate().Number("user.Age", null); %>
  12.         <% this.JQuery().Validate().Range("user.Age", 15, 28, null); %>
  13.     </p>
  14.     <p>
  15.         <span>Email:</span>
  16.         <input type="text" name="user.Email" />
  17.         <% this.JQuery().Validate().Required("user.Email", "email please..."); %>
  18.         <% this.JQuery().Validate().Email("user.Email", "valid email please..."); %>
  19.     </p>
  20.     <input type="submit" value="Submit" />
  21. </form>
复制代码
请看最后生成的HTML：
[code][/code]因为编写了客户端辅助方法，我们已经把繁冗的客户端脚本变成了可以由Visual Studio提示并轻易输出的服务器端辅助方法——您觉得如何，是否满意？
其实老赵还不满意，不过接下去的工作，我们下次再继续吧。
 
注1：什么？您说没有听说过“记录 - 汇总”这个模式？嗯，这是正常的，因为这是老赵“发明”的模式之一。

来源：程序园用户自行投稿发布，如果侵权，请联系站长删除
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！

使用道具 举报
相关推荐
B Color Image Link Quote Code Smilies
您需要登录后才可以回帖 登录 | 立即注册
发帖
寇秀娟
2025-5-30 01:04:16

0

粉丝关注

12

主题发布

板块介绍填写区域，请于后台编辑
微信扫一扫