在本章中,无涯教程将继续讨论标签助手,还将在应用程序中添加新功能,并使其能够编辑现有员工的详细信息,将在每个员工添加一个链接,该链接将转到HomeController上的Edit动作。
@model HomePageViewModel @{ ViewBag.Title = "Home"; } <h1>Welcome!</h1> <table> @foreach (var employee in Model.Employees) { <tr> <td>@employee.Name</td> <td> <a asp-controller = "Home" asp-action = "Details" asp-routeid = "@employee.Id">Details</a> <a asp-controller = "Home" asp-action = "Edit" asp-routeid = "@employee.Id">Edit</a> </td> </tr> } </table>
还没有"Edit"操作,但是需要一个可以编辑的员工ID。因此,首先通过右键单击 Views→Home 文件夹并选择 Add→New Items 创建新视图。
在中间窗格中,选择" MVC View Page";调用页面Edit.cshtml。现在,单击添加按钮。
在 Edit.cshtml 文件中添加以下代码。
@model Employee @{ ViewBag.Title = $"Edit {Model.Name}"; } <h1>Edit @Model.Name</h1> <form asp-action="Edit" method="post"> <div> <label asp-for = "Name"></label> <input asp-for = "Name" /> <span asp-validation-for = "Name"></span> </div> <div> <input type = "submit" value = "Save" /> </div> </form>
对于此页面的标题,可以说无涯教程要编辑然后提供员工姓名。
转到HomeController类,并添加 Edit 操作,该操作返回为用户提供表单以编辑员工的视图的视图,然后将需要第二个Edit操作,该操作将响应HttpPost,如下所示。
[HttpGet] public IActionResult Edit(int id) { var context = new FirstAppDemoDbContext(); SQLEmployeeData sqlData = new SQLEmployeeData(context); var model = sqlData.Get(id); if (model == null) { return RedirectToAction("Index"); } return View(model); }
首先,需要一个可以响应GET请求的编辑操作,这将需要一个员工ID,这里的代码将类似于" Details"操作中的代码,将首先提取用户要编辑的员工的数据,还需要确保该雇员确实存在,如果不存在,会将用户重定向回Index视图,当有员工存在时,将渲染"Edit"视图。
还需要响应表单将发送的HttpPost。
在HomeController.cs文件中添加一个新类,如以下程序所示。
public class EmployeeEditViewModel { [Required, MaxLength(80)] public string Name { get; set; } }
以下是"Edit"操作的实现。
[HttpPost] public IActionResult Edit(int id, EmployeeEditViewModel input) { var context = new FirstAppDemoDbContext(); SQLEmployeeData sqlData = new SQLEmployeeData(context); var employee = sqlData.Get(id); if (employee != null && ModelState.IsValid) { employee.Name = input.Name; context.SaveChanges(); return RedirectToAction("Details", new { id = employee.Id }); } return View(employee); }
根据路由规则,应始终从在URL中具有ID的URL交付编辑表单,如/home/edit/1 。
将名称从"input"视图模型复制到从数据库中检索到的员工,并保存更改,SaveChagnes()方法将把所有这些更改刷新到数据库中。
以下是HomeController的完整实现。
using Microsoft.AspNet.Mvc; using FirstAppDemo.ViewModels; using FirstAppDemo.Services; using FirstAppDemo.Entities; using FirstAppDemo.Models; using System.Collections.Generic; using System.Linq; using System.ComponentModel.DataAnnotations; namespace FirstAppDemo.Controllers { public class HomeController : Controller { public ViewResult Index() { var model = new HomePageViewModel(); using (var context = new FirstAppDemoDbContext()) { SQLEmployeeData sqlData = new SQLEmployeeData(context); model.Employees = sqlData.GetAll(); } return View(model); } public IActionResult Details(int id) { var context = new FirstAppDemoDbContext(); SQLEmployeeData sqlData = new SQLEmployeeData(context); var model = sqlData.Get(id) if (model == null) { return RedirectToAction("Index"); } return View(model); } [HttpGet] public IActionResult Edit(int id) { var context = new FirstAppDemoDbContext(); SQLEmployeeData sqlData = new SQLEmployeeData(context); var model = sqlData.Get(id); if (model == null) { return RedirectToAction("Index"); } return View(model); } [HttpPost] public IActionResult Edit(int id, EmployeeEditViewModel input) { var context = new FirstAppDemoDbContext(); SQLEmployeeData sqlData = new SQLEmployeeData(context); var employee = sqlData.Get(id); if (employee != null && ModelState.IsValid) { employee.Name = input.Name; context.SaveChanges(); return RedirectToAction("Details", new { id = employee.Id }); } return View(employee); } } public class SQLEmployeeData { private FirstAppDemoDbContext _context { get; set; } public SQLEmployeeData(FirstAppDemoDbContext context) { _context = context; } public void Add(Employee emp) { _context.Add(emp); _context.SaveChanges(); } public Employee Get(int ID) { return _context.Employees.FirstOrDefault(e => e.Id == ID); } public IEnumerable<Employee> GetAll() { return _context.Employees.ToList<Employee>(); } } public class HomePageViewModel { public IEnumerable<Employee> Employees { get; set; } } public class EmployeeEditViewModel { [Required, MaxLength(80)] public string Name { get; set; } } }
编译程序并运行应用程序。
现在,有一个"Edit"链接;通过单击"Edit"链接来编辑Josh的详细信息。
将名称更改为Josh Groban。
单击保存按钮。
您可以看到名称已更改为Josh Groban,如上面的屏幕截图所示。现在单击"Home"链接。
在主页上,您现在将看到更新的名称。
参考链接
https://www.learnfk.com/asp.net_core/asp.net-core-razor-edit-form.html
标签:Core,ASP,Razor,Edit,SQLEmployeeData,context,new,model,public From: https://blog.51cto.com/u_14033984/7816475