首页 > 编程 > .NET > 正文

在ASP.NET中实现Model-View-Controller模式(1)

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

  背景:

  当利用asp.net创建web应用程序时,基于程序的复杂性,必须把程序分割成不同的部分以减少代码的重复及减少日后变革时所引起的改动。

 实现策略:

 为了解释如何在asp.net中实现(mvc)模型-视图-控制器模式,以及说明将软件分离成模型、视图、及控制器角色的好处,在此以一个示例程序为例进行说明。这个示例程序是一个带有下拉框的单页程序,它的功能是显示数据库中的数据。

  当用户在下拉框中选择了一个记录,并单击submit按钮的时候,程序从数据库中搜索与选中记录相关的数据库记录,并以列表的形式显示出来。下面,将以三种不同的实现方式进行实现。

  单页模式

  在asp.net中有许多解决这个问题的办法,其中最简单也是最直接的办法就是把所有的代码都放到一个文件中,并起名为solution.aspx,实现代码如下:

  <%@ import namespace="system.data" %>
  
  <%@ import namespace="system.data.sqlclient" %>
  
  <html>
  
  <head>
  
  <title>start</title>
  
  <script language="c#" runat="server">
  
  void page_load(object sender, system.eventargs e)
  
  {
  
  string selectcmd = "select * from recording";

sqlconnection myconnection =
  
  new sqlconnection(
  
  "server=(local);database=recordings;trusted_connection=yes");
  
  sqldataadapter mycommand = new sqldataadapter(selectcmd,
  
  myconnection);

dataset ds = new dataset();
  
  mycommand.fill(ds, "recording");

recordingselect.datasource = ds;
  
  recordingselect.datatextfield = "title";
  
  recordingselect.datavaluefield = "id";
  
  recordingselect.databind();
  
  }

void submitbtn_click(object sender, eventargs e)
  
  {
  
  string selectcmd =
  
  string.format(
  
  "select * from track where recordingid = {0} order by id",
  
  (string)recordingselect.selecteditem.value);

sqlconnection myconnection =
  
  new sqlconnection(
  
  "server=(local);database=recordings;trusted_connection=yes");

sqldataadapter mycommand = new sqldataadapter(selectcmd,
  
  myconnection);

dataset ds = new dataset();
  
  mycommand.fill(ds, "track");

mydatagrid.datasource = ds;
  
  mydatagrid.databind();
  
  }
  
  </script>
  
  </head>
  
  <body>
  
  <form id="start" method="post" runat="server">
  
  <h3>recordings</h3>
  
  select a recording:<br />
  
  <asp:dropdownlist id="recordingselect" runat="server" />
  
  <asp:button runat="server" text="submit" onclick="submitbtn_click" />
  
  <p/>
  
  <asp:datagrid id="mydatagrid" runat="server" width="700"
  
  backcolor="#ccccff" bordercolor="black" showfooter="false"
  
  cellpadding="3" cellspacing="0" font-name="verdana"
  
  font-size="8pt" headerstyle-backcolor="#aaaadd"
  
  enableviewstate="false" />
  
  </form>
  
  </body>
  
  </html>

 这个实现文件包含了模型、视图、控制器这三种角色,但是没有将它们分割为不同的文件或类。其中的视图对象用html实现,用一个数据绑定控件来显示从数据库返回的dataset中的数据。模型角色在page_load 和 submitbtn_click函数中实现。而控制器角色并没有显式的实现,而是由asp.net隐式实现。程序运行时,当用户发出页面的请求,页面随着用户的选择更新。

 mvc模式形容这种实现方式是一种被动的实现机制,asp.net充当了程序执行中的控制器的角色,但程序员必须将具体的事件处理方法添加到事件的响应函数中。如在这个例子中,控制器在页面加载之前调用page_load函数并执行其中的代码,当用户点击submit按钮时由系统调用submitbtn_click函数并执行。

 这种将代码都包含在一个文件中的实现方式非常的直接,而且当应用程序很小并不经常修改的时候也可以说是一种好的方法,但是如果下面的一些情况出现的话你也许会开始考虑修改这种实现方法:

 使编程的工作并行并减少由此带来的发生错误的可能性。为了增加工作的并行性,提高效率,你可能想让不同的人编写视图的代码及模型代码并尽力减少这种工作方式所带来的出错的可能性。例如:当所有的代码都在一个文件中的话,那么一个编程人员可能会在改变datagrid显示格式的时候无意中修改数据访问的代码。这种错误是很难被发现的,直到页面整体被编译的时候才会显现出来。。

 使你的数据访问代码在其它页面中重用。在这种单文件的实现方式中,除了拷贝代码,没有其它的方法能够做到代码的重用。拷贝的代码是很难被维护的,因为一旦代码发生了变化,你必须在所有的页面都进行修改。

 为了避免上面这些情况的发生,asp.net引入了代码分离(code-behind)机制。

 用代码分离机制进行重构
  
  microsoft visual studio .net中的代码分离机制使视图层的代码与模型及控制器的代码能够很容易的分离。每个asp.net页面都有一种机制,能够使其要调用的方法在一个与其分离的类中实现。这种方式使用起来非常的方便,而且也可以利用visual studio .net中的一些其它特性共同完成开发工作。比如如当你利用代码分离的机制开发你的页面的时候,可以利用智能感知(intellisense technology)显示出一个可用方法的列表方便编程。而智能感知技术在.aspx页面中是不能使用的。

 下面给出的是上面例子利用代码分离机制的实现。

 视图部分:

 视图层的代码现在一个单独的文件中实现。solution.aspx:

<%@ page language="c#" codebehind="solution.aspx.cs"
  
  autoeventwireup="false" inherits="solution" %>
  
  <html>
  
  <head>
  
  <title>solution</title>
  
  </head>
  
  <body>
  
  <form id="solution" method="post" runat="server">
  
  <h3>recordings</h3>
  
  select a recording:<br/>
  
  <asp:dropdownlist id="recordingselect" runat="server" />
  
  <asp:button id="submit" runat="server" text="submit"
  
  enableviewstate="false" />
  
  <p/>
  
  <asp:datagrid id="mydatagrid" runat="server" width="700"
  
  backcolor="#ccccff" bordercolor="black" showfooter="false"
  
  cellpadding="3" cellspacing="0" font-name="verdana" font-size="8pt"
  
  headerstyle-backcolor="#aaaadd" enableviewstate="false" />
  
  </form>
  
  </body>
  
  </html>

  大部分代码都与前面的解决方案的代码相同。主要的不同点是第一行:

  <%@ page language="c#" codebehind="solution.aspx.cs"
  
  autoeventwireup="false" inherits="solution" %>

 这行告诉asp.net执行环境,这个页面的具体实现机制在一个单独的类中。因为这个页面是独立的,因此如果数据访问的代码发生变化,这个页面并不需要做任何改动。同样,一些设计师也可以改变这个页面的代码而不会引起任何数据访问的错误。

  模型及控制器部分:
  
  这个解决方案的第二个部分是被隐藏的后台代码:

  using system;
  
  using system.data;
  
  using system.data.sqlclient;

public class solution : system.web.ui.page
  
  {
  
   protected system.web.ui.webcontrols.button submit;
  
   protected system.web.ui.webcontrols.datagrid mydatagrid;
  
   protected system.web.ui.webcontrols.dropdownlist recordingselect;

private void page_load(object sender, system.eventargs e)
  
   {
  
   if(!ispostback)
  
   {
  
   string selectcmd = "select * from recording";

sqlconnection myconnection =
  
   new sqlconnection(
  
   "server=(local);database=recordings;trusted_connection=yes");
  
   sqldataadapter mycommand = new sqldataadapter(selectcmd, myconnection);

dataset ds = new dataset();
  
   mycommand.fill(ds, "recording");

recordingselect.datasource = ds;
  
   recordingselect.datatextfield = "title";
  
   recordingselect.datavaluefield = "id";
  
   recordingselect.databind();
  
   }
  
   }

void submitbtn_click(object sender, eventargs e)
  
   {
  
   string selectcmd =
  
   string.format(
  
   "select * from track where recordingid = {0} order by id",
  
   (string)recordingselect.selecteditem.value);

sqlconnection myconnection =
  
   new sqlconnection(
  
   "server=(local);database=recordings;trusted_connection=yes");
  
   sqldataadapter mycommand = new sqldataadapter(selectcmd, myconnection);

dataset ds = new dataset();
  
   mycommand.fill(ds, "track");

mydatagrid.datasource = ds;
  
   mydatagrid.databind();
  
   }

#region web form designer generated code
  
   override protected void oninit(eventargs e)
  
   {
  
   //
  
   // codegen: this call is required by the asp.net web form designer.
  
   //
  
   initializecomponent();
  
   base.oninit(e);
  
   }

/// <summary>
  
   /// required method for designer support - do not modify
  
   /// the contents of this method with the code editor.
  
   /// </summary>
  
   private void initializecomponent()
  
   {
  
   this.submit.click += new system.eventhandler(this.submitbtn_click);
  
   this.load += new system.eventhandler(this.page_load);

}
  
   #endregion
  
  }

  这里将代码从上个实现方法单独的文件移动到了一个它自己的文件中。并通过一些机制把视图以及模型控制器这两个部分连接成一个整体,如这个类中的成员变量与solution.aspx文件中所用的控件是同名的。另外一个必须显示指出的是控制器如何将行为与其所对应的事件进行连接。在这个例子中initializecomponent函数连接了两个事件。第一个将load事件与 page_load函数连接,第二个是click事件,当submit按钮被点击时调用submitbtn_click函数。

 代码分离是一种将视图部分与模型及控制器部分相分离的一种优秀的机制。但当你想把分离出的后台的代码给其它页面重用时可能还是不足的。在技术上,将页面背后的代码复用是可行的,但随着你需要共享的页面的增加,把页面与后台代码相连接是很困难的。

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