Slark.NET-博客园 http://www.cnblogs.com/slark/p/mvc5-ef6-bs3-get-started-rud.html

系列教程:MVC5 + EF6 + Bootstrap3

上一节:MVC5 + EF6 + Bootstrap3 (12) 新建数据

下一节:MVC5 + EF6 + Bootstrap3 (14) 分部视图PartialView

源码下载:点我下载

目录

前言

所谓万事开头难,前面用两节介绍了查询页面,一节介绍了创建数据。由于前面做了大量的铺垫,本节就能顺利的将查看详情、编辑数据、删除数据在一节中全部介绍给大家。前后这几节加起来就完成了一个简单信息系统的增删改查(CRUD)的所有操作。

添加链接

要进行这三个操作,首先在查询页面的每一条记录后面添加对应的链接。代码如下:

<tr>
<td>
@Html.DisplayFor(modelItem => item.FirstName)
</td>
<td>
@Html.DisplayFor(modelItem => item.LastName)
</td>
<td>
@Html.DisplayFor(modelItem => item.Sex)
</td>
<td>
@Html.DisplayFor(modelItem => item.Rating)
</td>
<td>
@Html.ActionLink("Details","Details", new { id = item.ID }) |
@Html.ActionLink("Edit", "Edit" , new { id = item.ID }) |
@Html.ActionLink("Delete", "Delete", new { id = item.ID })
</td>
</tr>

上面代码对应着数据列表的一行,其中黄色的部分就是我们添加的链接。这三个链接对应三个不同的操作,他们都需要ID作为参数来确定操作的是哪一条数据,改动后的页面显示如下:

红框部分就是我们添加的链接。

查看详情

查看详情对应Details链接。点击链接之后会请求当前Contoller,也就是CompanyController的Details Action。那么我们就在~\Controllers\CompanyController.cs下写这个Action。代码如下:

 public ActionResult Details(int? id)
{
if (id == null)
{
return new HttpStatusCodeResult(HttpStatusCode.BadRequest);
}
Worker worker = db.Workers.Find(id);
if (worker == null)
{
return HttpNotFound();
}
return View(worker);
}

第3-6行表示如果访问这个Actions时没有给参数id则返回BadRequest错误。如下图所示,地址栏里面没有给出ID,返回Bad Request错误。

第7-11行表示如果根据id没有找到对应的信息则返回HttpNotFound错误,如下图所示:

第12行,如果根据id找到了对应的信息则用View显示。

在~Views\Company\下创建Details.cshtml视图,写入代码如下:

 @model SlarkInc.Models.Worker
@{
ViewBag.Title = "Details";
}
<h2>Worker Details</h2>
<div>
<h4>Worker</h4>
<hr />
<dl class="dl-horizontal">
<dt>
@Html.DisplayNameFor(model => model.FirstName)
</dt>
<dd>
@Html.DisplayFor(model => model.FirstName)
</dd>
<dt>
@Html.DisplayNameFor(model => model.LastName)
</dt>
<dd>
@Html.DisplayFor(model => model.LastName)
</dd>
<dt>
@Html.DisplayNameFor(model => model.Sex)
</dt>
<dd>
@Html.DisplayFor(model => model.Sex)
</dd>
<dt>
@Html.DisplayNameFor(model => model.Rating)
</dt>
<dd>
@Html.DisplayFor(model => model.Rating)
</dd>
</dl>
</div>
<p>
@Html.ActionLink("Edit", "Edit", new { id = Model.ID }) |
@Html.ActionLink("Back to List", "Index")
</p>

代码中用DisplayNameFor函数显示属性名,用DisplayFor函数显示属性值。

页面用<dl><dt><dd>和Bootstrap的"dl-horizontal"类布局页面,使每一个属性名和属性值占一行,显示效果如下:

第37行给出了编辑此页面的链接。38行给出返回查询页面的链接。

编辑数据

在~\Controllers\CompanyController.cs中加入用来进入Edit页面的Action代码如下:

public ActionResult Edit(int? id)
{
if (id == null)
{
return new HttpStatusCodeResult(HttpStatusCode.BadRequest);
}
Worker worker = db.Workers.Find(id);
if (worker == null)
{
return HttpNotFound();
}
return View(worker);
}

看起来眼熟?没错,和Details的Action是一模一样的,这里就不重复了。

下面写View。在~\Views\Company\下创建Edit.cshtml视图,写入代码如下:

 @model SlarkInc.Models.Worker
@{
ViewBag.Title = "Edit";
}
<h2>Worker Edit</h2>
@using (Html.BeginForm())
{
@Html.AntiForgeryToken()
<div class="form-horizontal">
<hr />
@Html.ValidationSummary(true)
@Html.HiddenFor(model => model.ID)
<div class="form-group">
@Html.LabelFor(model => model.FirstName, new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.FirstName)
@Html.ValidationMessageFor(model => model.FirstName)
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.LastName, new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.LastName)
@Html.ValidationMessageFor(model => model.LastName)
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.Sex, new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EnumDropDownListFor(model => model.Sex)
@Html.ValidationMessageFor(model => model.Sex)
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.Rating, new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.Rating)
@Html.ValidationMessageFor(model => model.Rating)
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
@Html.Submit("Submit")
</div>
</div>
</div>
}
<div>
@Html.ActionLink("Back to List", "Index")
</div>

这个页面的代码与上一节的插入数据页面的代码基本相同,可以参照上一节的代码说明,需要看的点这里

第12行用HiddenFor函数储存当前要修改的记录的ID以便提交后找到对应的记录进行更新。

页面显示如下:

接下来我们来写提交更新数据之后需要访问的Action,在~\Controllers\Company.cs中加入用Post方法访问的Edit Action,代码如下:

 [HttpPost]
[ValidateAntiForgeryToken]
public ActionResult Edit([Bind(Include = "ID, FirstName, LastName, Sex, Rating")] Worker worker)
{
if (ModelState.IsValid)
{
db.Entry(worker).State = EntityState.Modified;
db.SaveChanges();
return RedirectToAction("Index");
}
return View(worker);
}

这段带码的知识点讲解与上一节Create提交Action的基本相同,点击这里查看

不同点是第7行,根据获得的worker实例,在数据列表中找到对应记录,更新其值,并设置其状态为Modified。最后将改动保存到数据库并跳转回数据查询页面。

删除数据

删除数据不需要页面显示数据,只需在CompanyController下加入一个Delete Action删除数据即可,代码如下:

 public ActionResult Delete(int id)
{
try
{
Worker workerToDelete = new Worker() { ID = id };
db.Entry(workerToDelete).State = EntityState.Deleted;
db.SaveChanges();
}
catch(DataException/*dex*/)
{
return RedirectToAction("Index", new { id = id, saveChangesError = true });
}
return RedirectToAction("Index");
}

第5行创建一个只有ID被赋值的worker实例。然后第6行根据这个实例的ID在数据库中找到对应的数据,设置其状态为Deleted已删除,第7行执行删除操作。

如果删除成功则在第13行跳转回查询页面,如果失败则跳转回查询页面并传递两个参数传递失败记录的ID及saveChangesError = true。根据这两个传递的参数可以在查询页面写出错误信息。这里就不详细描述了。

这样点击删除链接就能在查询页面看到那条数据被删除了。

结尾

到此,我们完成了对一个简单数据模型的增删改查操作。不过其中还有很多知识点没有详细描述,比如数据验证、EF操作数据的函数、View中的各种不同的Http响应等等。后面会一一详细介绍。

觉得有用就推荐下吧!

本节主要参考:Implementing Basic CRUD Functionality with the Entity Framework in ASP.NET MVC Application

上一节:MVC5 + EF6 + Bootstrap3 (12) 新建数据

下一节:MVC5 + EF6 + Bootstrap3 (14) 分部视图PartialView

作者:Slark.NET

出处:http://www.cnblogs.com/slark/

本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。如有问题或建议,请多多赐教,非常感谢。

MVC5 + EF6 + Bootstrap3 (13) 查看详情、编辑数据、删除数据的更多相关文章

  1. MVC5 + EF6 + Bootstrap3 (12) 新建数据

    Slark.NET-博客园 http://www.cnblogs.com/slark/p/mvc5-ef6-bs3-get-started-create.html 系列教程:MVC5 + EF6 + ...

  2. MVC5 + EF6 + Bootstrap3 (14) 分部视图PartialView

    Slark.NET-博客园 http://www.cnblogs.com/slark/p/mvc5-ef6-bs3-get-started-partialview.html 系列教程:MVC5 + E ...

  3. MVC5 + EF6 + Bootstrap3系列教程

    本系列教程以ASP.NET MVC5为核心框架,使用Entity Framewok6访问数据,并使用Bootstrap3作为前端UI框架.帮助大家开发出一套高效.美观.稳定.实用的软件系统. MVC5 ...

  4. MVC5 + EF6 + Bootstrap3 (10) 数据查询页面

    文章来源:Slark.NET-博客园 http://www.cnblogs.com/slark/p/mvc5-ef6-bs3-get-started-search-page.html 系列教程:MVC ...

  5. MVC5 + EF6 + Bootstrap3 (15) 应用ModelState和Data Annotation做服务器端数据验证

    Slark.NET-博客园 http://www.cnblogs.com/slark/p/mvc5-ef6-bs3-get-started-server-side-validation.html 系列 ...

  6. (12) MVC5 EF6 Bootstrap3

    MVC5 + EF6 + Bootstrap3 (12) 新建数据 系列教程:MVC5 + EF6 + Bootstrap3 上一节:MVC5 + EF6 + Bootstrap3 (11) 排序.搜 ...

  7. MVC5 + EF6 + Bootstrap3 (16) 客户端验证

    Slark.NET-博客园 http://www.cnblogs.com/slark/p/mvc5-ef6-bs3-get-started-client-side-validation.html 系列 ...

  8. MVC5 + EF6 + Bootstrap3 (11) 排序、搜索、分页

    系列教程:MVC5 + EF6 + Bootstrap3 上一节:MVC5 + EF6 + Bootstrap3 (10) 数据查询页面 源码下载:点我下载 我工作的源码:http://www.jin ...

  9. MVC5 + EF6 + Bootstrap3 (9) HtmlHelper用法大全(下)

    文章来源:Slark.NET-博客园 http://www.cnblogs.com/slark/p/mvc5-ef6-bs3-get-started-httphelper-part2.html 上一节 ...

随机推荐

  1. 通过正则获取URL中的参数

    闲着无聊用正则做了一个获取URL参数的小算法^_^ function getParam(name) { var objs = window.location.search.match("(\ ...

  2. 【整理贴】DBA-常用到的动态视图分析语句

    测试应用环境:SQL2008 R2.SQL2012.SQL2014 --语句1:获取前20逻辑读取次数或逻辑写入次数或CPU 时间 SELECT TOP 20 SUBSTRING(qt.TEXT, ( ...

  3. SQL基础(2)-约束

    1. 添加主键约束 a.创建表时添加主键(默认系统命名主键) create table pt_ticket_info( id varchar2(50) primary key not null, -- ...

  4. 快速解决mysql Lost connection to MySQL server at 'reading initial communication packet及can't connect to mysql server on 'localhost'

    今天在使用Navicat连一个远程mysql时,总是提示连接不成功,提示Lost connection to MySQL server at 'reading initial communicatio ...

  5. C语言使用宏实现2个变量的交换

    记录哪个方法更普适,更高效,这些方法不包括使用函数的方法,如果使用函数的话,使用指针的方法更合适. 使用中间变量 形如 int tmp, tmp = a; a=b; b = tmp; #define ...

  6. java :hello world

    练习java的基本语法. output hellow world. 需求:打包自身项目的bin目录文件为一个临时可运行的jar文件,执行完后删除. 使用process执行jar文件,返回输入流和错误流 ...

  7. Sample: Write And Read data from HDFS with java API

    HDFS: hadoop distributed file system 它抽象了整个集群的存储资源,可以存放大文件. 文件采用分块存储复制的设计.块的默认大小是64M. 流式数据访问,一次写入(现支 ...

  8. 真人动作捕捉系统 for Unity

    真人动作捕捉 在Asset Store中浏览Mecanim相关的资源时,发现了这个 资源信息 Asset Store:https://www.assetstore.unity3d.com/#/cont ...

  9. Linux压力测试工具Tsung安装、使用和图形报表生成

    简介 Tsung 是一个压力测试工具,可以测试包括HTTP, WebDAV, PostgreSQL, MySQL, LDAP, and XMPP/Jabber等服务器.针对 HTTP 测试,Tsung ...

  10. [Usaco2008 Nov]mixup2 混乱的奶牛 简单状压DP

    1231: [Usaco2008 Nov]mixup2 混乱的奶牛 Time Limit: 10 Sec  Memory Limit: 162 MBSubmit: 685  Solved: 383[S ...