在ASP.NET Core Razor Pages中编辑学生信息
admin
2022-03-02在ASP.NET Core Razor Pages中编辑学生信息
导航:
在此视频中,我们将讨论实现“编辑“Razor Pages。
当我们单击学生列表 Razor Pages(/Student/Index.cshtml)上的“ 编辑”按钮时,我们要将请求重定向到“ 编辑“Razor Pages(/Student/Edit.cshtml)。
<a asp-page="/Students/Edit" asp-route-ID="@student.Id" class="btn btn-primary m-1">编辑</a>
编辑 Razor Pages
将新的 Razor Pages添加到"Students"
文件夹。将其命名为Edit.cshtml。从设计的角度来看,“编辑“Razor Pages应如下图所示。使用文本框编辑学生姓名和电子邮件以及Marjor
的选择列表。
Edit.cshtml.cs
using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.RazorPages;
using YoYoMooc.StudentManagement.Models;
using YoYoMooc.StudentManagement.Services;
namespace YoYoMooc.StudentManagement.RazorPage.Pages.Students
{
public class EditModel : PageModel
{
private readonly IStudentRepository _studentRepository;
public EditModel(IStudentRepository studentRepository)
{
this._studentRepository = studentRepository;
}
//这是显示模板将用于的属性,显示现有的学生数据
public Student Student { get; set; }
public IActionResult OnGet(int id)
{
Student = _studentRepository.GetStudent(id);
if (Student == null)
{
return RedirectToPage("/NotFound");
}
return Page();
}
}
}
Edit.cshtml
如果您不熟悉Taghelper,我们将在我们的ASP.NET Core初学者教程中从第35至40部分详细讨论它们。
@page "{id:min(1)}"
@using YoYoMooc.StudentManagement.Models
@model EditModel
@{
ViewData["Title"] = "编辑";
}
<h1>编辑学生</h1>
<form method="post" class="mt-3">
@*使用隐藏的input标签来存储提交表单时需要的学生id*@
<input hidden asp-for="Student.Id" />
@*asp-for TagHelper 负责在处理在不同的标签中显示现有的数据*@
<div class="form-group row">
<label asp-for="Student.Name" class="col-sm-2 col-form-label">
</label>
<div class="col-sm-10">
<input asp-for="Student.Name" class="form-control" placeholder="Name">
</div>
</div>
<div class="form-group row">
<label asp-for="Student.Email" class="col-sm-2 col-form-label"></label>
<div class="col-sm-10">
<input asp-for="Student.Email" class="form-control" placeholder="Email">
</div>
</div>
<div class="form-group row">
<label asp-for="Student.Major" class="col-sm-2 col-form-label"></label>
<div class="col-sm-10">
<select asp-for="Student.Major" class="custom-select mr-sm-2"
asp-items="Html.GetEnumSelectList<MajorEnum>()">
<option value="">请选择</option>
</select>
</div>
</div>
<div class="form-group row">
<div class="col-sm-10">
<button type="submit" class="btn btn-primary">更新</button>
<a asp-page="/Students/Index" class="btn btn-primary">取消</a>
</div>
</div>
</form>
_ViewImports.cshtml中的更改
@using YoYoMooc.StudentManagement.Models