ASP.NETMVC是什么

public static void RegisterRoutes(RouteCollection routes)  {    routes.IgnoreRoute("{resource}.axd/{*pathInfo}");     routes.MapRoute(        "Default",                                                      "{controller}/{action}/{id}",                                   new { controller = "Contact", action = "List", id = "" }      );  }

public ActionResult List()  {    var model = ContactPersonManager.GetList();    return View(model);  }

<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage" %>

            Id       Full Name       Date of Birth       Type                                                     <%        if (Model != null)        {          foreach (var person in Model)          {%>            <%= person.Id %>       <%= person.FullName %>       <%= person.DateOfBirth.ToString("d") %>       <%= person.Type %>       Addresses       Email       Phone Numbers       Edit       Delete          <%          }        }else{%>            No Contacts Yet              <% }%>   

第一行代码的作用是一个允许用户添加新联系人的按钮，第二行代码是一个空div,方便后面显示信息，第三行代码是jQuerymodal提示验证对话框的一部分，用于提示用户是否删除一条记录。

还需要在页面中添加3个js文件，第一个是主要的jQuery文件，其他两个分别是jQueryUI的核心js,以及datepicker和modaldialog部分的JS：

下面是我们生成后的列表显示视图以及完全的JS代码：

   $(function() {      // row colours      $('tr:even').css('background-color', '#EFF3FB');      $('tr:odd').css('background-color', '#FFFFFF');      // selected row managment      $('tr').click(function() {        $('tr').each(function() {          $(this).removeClass('SelectedRowStyle');        });        $(this).addClass('SelectedRowStyle');      });       // hide the dialog div      $('#dialog').hide();      // set up ajax to prevent caching of results in IE      $.ajaxSetup({ cache: false });      // add an onclick handler to items with the "link" css class      $('.link').live('click', function(event) {        var id = $.trim($('td:first', $(this).parents('tr')).text());        var loc = $(this).attr('title');        // check to ensure the link is not a delete link        if (loc.lastIndexOf('delete') == -1) {          $.get(loc + '/' + id, function(data) {            $('#details').html(data);          });        // if it is, show the modal dialog           } else {          $('#dialog').dialog({            buttons: {              'Confirm': function() {                window.location.href = loc + '/' + id;              },              'Cancel': function() {                $(this).dialog('close');              }            }          });           $('#dialog').dialog('open');          }        });         // add an onclick event handler to the add contact button        $('#addContact').click(function() {          $.get('Contact/Add', function(data) {            $('#details').html(data);          });        });       });  

上面代码看起来让人望而却步，但实际上，使用jQuery，这非常简单。并且在上面代码中我多处加入了注释，代码一开始是用js代码是替换了数据源控件默认呈现出来的隔行变色的颜色。然后我加入了使点击行点击时可以变色的代码。然后下面的代码是防止IE对页面进行缓存。如果不禁止了IE缓存，你会为执行编辑或者删除以后，数据库改变了但页面却没有发生变化而撞墙的。

接下来的代码更有趣了，依靠live()方法可以确$选择器中所有匹配的元素都被附加了相应的事件，无论元素当前是否存在于页面中。比如说，当你点击了Addresses链接，相应的结果就会在另一个表中出现：

上图中可以看出表中包含编辑和删除链接，如果不使用live()方法，相应的链接就不会被附加事件。所有具有class为link的元素都会被委派上click事件。这个事件会首先获取到当前条目的id.以ContactPerson表为例，这个id就是ContactPersonId.在相应的子表中，则id会是电话号码或者是email地址。这些都是需要传递给controlleraction作为参数进行编辑，删除，或者显示的。

你现在可以看出为什么我为每个单元格加上title属性了吧。title属性包含相关的route信息，而完全的url则把id附加到route作为url.然后，上面js会做一个检查，来看route信息内是否包含delete,如果包含delelte,则弹出一个对话框来提示用户是否要删除。看，是不是很简单？最后，代码会为添加联系人按钮添加click事件。

添加联系人以及自定义ViewModels

使用添加一条记录时,通常的做法是提供一个包含一系列输入框的form.对于ContactPerson类的大多属性来说，都是可以直接赋值的，比如：姓，名字，生日。但是其中有一个属性却不能直接赋值--Type属性，这个值是从PersonType.cs(朋友，同事等)中的枚举类型中选择出来的.这意味着用户只能从有限的几种选项中选择一种。可以用DropDwonList来实现，但是ContactPerson对象并不包含枚举类型的所有选项，所以我们只能提供一个自定义版本的ContactPerson类传递给View。这也是为什么要用到自定义ViewModel。

我看过很多关于在程序的哪里放置ViewModels的讨论，有些人认为自定义ViewModels是Model的一部分，但是我认为它和View紧密相关，ViewModels并不是MVC程序必不可少的一部分，也不能服用，所以它不应该放到Model中区。我把所有的ViewModel放入一个创建的ViewModel文件夹下，ContactPersonViewModel.cs的源代码如下：

using System;  using System.Collections.Generic;  using System.Web.Mvc;   namespace ContactManagerMVC.Views.ViewModels  {    public class ContactPersonViewModel    {      public int Id { get; set; }      public string FirstName { get; set; }      public string MiddleName { get; set; }      public string LastName { get; set; }      public DateTime DateOfBirth { get; set; }      public IEnumerable Type { get; set; }    }  }

看上面类的最后一个属性，我将这个type属性设置成IEnumerable类型，这样就可以将Type绑定到View中的Html.DropDownList了。

对应的，也要在Controller中添加2个action，第一个action使用AcceptVerbs(HttpVerbs.Get)标签，第二个action使用AcceptVerbs(HttpVerbs.Post)标签，第一个方法用于从服务器向客户端传值，第一个方法处理从form提交的数据。

上面第一个action的前几行代码将ContactType枚举类型转换成数组，数组中的每一个元素都是一个包含id和name属性的匿名对象，id是枚举值，Name是和对应枚举匹配的constant值，ContactPersonViewModel然后进行初始化并且Type属性被赋值相应的类型。我使用PartialView来添加联系人和使用ContactPersonViewModel类型的强类型，对应View部分的代码如下：

在最上面的代码我使用了jQueryUI的Datepicker插件作为DateOfBirth输入框的选择方式，而DateOfBirth的第二个参数保证这个textbox在初始状态下为空。此外，所有的输入框对ContactPerson的对应属性名相同，这是为了确保默认的modelbinder不出差错，MVC还自动为ContactType枚举进行绑定。

负责响应Post请求的方法可以自动将Request.Form的值和ContactPerson对象的对应属性进行匹配，然后调用BLL层的Save()方法，然后RedicrectToAction会让页面刷新最后调用List这个action。

编辑一个联系人

我们在前面已经看到jQuery是如何调用Edit这个action并把被编辑人的id作为参数进行传递的了，然后id用于通过众所周知的bll调用DAL从数据库将联系人的详细信息取出来。

   $(function() {      $('#DateOfBirth').datepicker({dateFormat: 'yy/mm/dd'});    });    <% using (Html.BeginForm("Edit", "Contact", FormMethod.Post)) {%>                            Name                                        Middle Name                                        Last Name                                        Date of Birth                                        Type                                        <%= Html.Hidden("Id") %>                           
<%= Html.TextBox("FirstName") %>
<%= Html.TextBox("MiddleName") %>
<%= Html.TextBox("LastName") %>
<%= Html.TextBox("DateOfBirth", Model.DateOfBirth.ToString("yyyy/MM/dd")) %>
<%= Html.DropDownList("Type")%>
 <% } %>

关键不同是DateOfBirth包含一个将生日信息转换更容易识别的方式，还有在提交按钮附近添加了一个Html.Hidden()，用于保存被编辑用户的id。当然，form的action属性肯定是和Add的View不同。在Form中可以加一个参数用于告诉Action是AddView还是EditView,这样就能减少代码的重复，但是在示例代码中我还是把他们分成了不同的action,来让职责划分的更清晰一些。

删除一个联系人

删除action就简单多了，并且不需要与之相关的View.仅仅是重新调用List这个action,被删除的数据就不复存在了。上面代码是我对BLL和DAL做出改变的地方，原来的ContactPersonManager.Delete()方法的参数是Person的实例，而在DAL中，只有id作为参数。我看不出传递整个对象给BLL,但BLL却只传递对象的唯一ID给DAL的意义所在，所以我将BLL的代码改成接受int类型的参数，这样写起来会更简单。当删除链接被点击时，调用jQuery的confirmationmodaldialog:

如果点击取消，则什么事也不发生，如果点击确认，则链接就会指向响应的deleteaction。

管理集合

所有的集合--PhoneNumberList，EmailAddressLIst，AddressList被管理的方式如出一辙。所以，我仅仅挑选EmailAddressLIst作为示例来说明方法，你可以下载示例代码来看其他部分。上面方法使用联系人的id作为联系人，并且返回一个自定义ViewModel—EmailAddressListViewModel.这也是将联系人的id传到View的方法：

   $(function() {      $('#add').click(function() {        $.get('Email/Add/<%= Model.ContactPersonId %>', function(data) {          $('#details').html(data);        });      });    });             Contact Person Id      Email      Type                      <%if(Model.EmailAddresses != null)       {foreach (var email in Model.EmailAddresses) {%>          <%= email.Id %>      <%= email.Email %>      <%= email.Type %>      Edit      Delete             <%}      }else   {%>          No email addresses for this contact      <%}%>  

你可以看出添加方法需要ContactPersonID作为参数，我们需要确保可以添加新的联系人到响应的联系人列表。编辑和删除方法也是如此--id参数通过url传递到相关action.而所有的单元格都有title属性，这样就可以使用前面部署的live()方法:

[AcceptVerbs(HttpVerbs.Get)]  public ActionResult Add(int id)  {    var contactTypes = Enum.GetValues(typeof(ContactType))      .Cast()      .Select(c => new      {        Id = c,        Name = c.ToString()      });    var model = new EmailAddressViewModel                  {                    ContactPersonId = id,                    Type = new SelectList(contactTypes, "ID", "Name")                  };    return PartialView("Add", model);  }    [AcceptVerbs(HttpVerbs.Post)]  public ActionResult Add(EmailAddress emailAddress)  {    emailAddress.Id = -1;    EmailAddressManager.Save(emailAddress);    return RedirectToAction("List", new {id = emailAddress.ContactPersonId});  }

创建自定义ViewModel存在的目的是为了对现有的EmailAddress进行添加或编辑，这包括一些绑定IEnumerable集合到Typedropdown的属性，上面两个Add不同之处在于他们的返回不同，第一个返回partialview,第二个返回List这个action。

集合中的每一个选在在一开始都会将id设为-1,这是为了保证符合”Upsert”存储过程的要求，因为Imar对于添加和删除使用的是同一个存储过程，如果不设置成-1,则当前新建的联系人会更新掉数据库中的联系人。

上面jQuery代码负责通过Ajax提交form.jQuery给htmlbutton(而不是inputtype=”submit”)附加事件，然后将页面中的内容序列化并通过post请求发送到使用合适AcceptVerbs标签修饰的名为add()的action。

编辑和删除EmailAddress对象

编辑EmailAddress对象所涉及的action和前面提到的很相似，仍然是两个action,一个用于处理get请求，另一个用于处理post请求：

AcceptVerbs(HttpVerbs.Get)]  public ActionResult Edit(int id)  {    var emailAddress = EmailAddressManager.GetItem(id);    var contactTypes = Enum.GetValues(typeof(ContactType))      .Cast()      .Select(c => new      {        Id = c,        Name = c.ToString()      });    var model = new EmailAddressViewModel    {      Type = new SelectList(contactTypes, "ID", "Name", emailAddress.Type),      Email = emailAddress.Email,      ContactPersonId = emailAddress.ContactPersonId,      Id = emailAddress.Id    };    return View(model);  }   [AcceptVerbs(HttpVerbs.Post)]  public ActionResult Edit(EmailAddress emailAddress)  {    EmailAddressManager.Save(emailAddress);    return RedirectToAction("List", "Email", new { id = emailAddress.ContactPersonId });  }

下面的partialView代码现在应该很熟悉了吧：

   $(function() {      $('#save').click(function() {        $.ajax({          type: "POST",          url: $("#EditEmail").attr('action'),          data: $("#EditEmail").serialize(),          dataType: "text/plain",          success: function(response) {            $("#details").html(response);          }        });      });    });    <% using(Html.BeginForm("Edit", "Email", FormMethod.Post, new { id = "EditEmail" })) {%>     Email:   <%= Html.TextBox("Email")%>     Type:   <%= Html.DropDownList("Type") %>     <%= Html.Hidden("ContactPersonId") %><%= Html.Hidden("Id") %>     

上面代码仍然和AddView很像，除了包含EmailAddress.Id的html隐藏域，这是为了保证正确的email地址被更新，而Deleteaction就不用过多解释了吧。

public ActionResult Delete(int id)  {    EmailAddressManager.Delete(id);    return RedirectToAction("List", "Contact");  }

到此，相信大家对“ASP.NET MVC是什么”有了更深的了解，不妨来实际操作一番吧！这里是创新互联网站，更多相关内容可以进入相关频道进行查询，关注我们，继续学习！