學習ASP.NET Core Razor 編程系列十——添加新字段

學習ASP.NET Core Razor 編程系列目錄

學習ASP.NET Core Razor 編程系列一

學習ASP.NET Core Razor 編程系列二——添加一個實體

 學習ASP.NET Core Razor 編程系列三——創建數據表及創建項目基本頁面

學習ASP.NET Core Razor 編程系列四——Asp.Net Core Razor列表模板頁面

學習ASP.NET Core Razor 編程系列五——Asp.Net Core Razor新建模板頁面

學習ASP.NET Core Razor 編程系列六——數據庫初始化

學習ASP.NET Core Razor 編程系列七——修改列表頁面

學習ASP.NET Core Razor 編程系列八——並發處理

學習ASP.NET Core Razor 編程系列九——增加查詢功能

 

       在經過了上面幾篇文章的學習這賓，本篇文章我們來學習如何在已經的功能中添加新字段。

一、添加出版社字段到實體類

          我們首先在Visual Studio 2017的解決方案資源管理器中打開 Models/Books.cs 文件，並添加一個Publishing字段，代碼如下：

using System;
using System.Collections.Generic;
using System.ComponentModel.DataAnnotations;
using System.Linq;
using System.Threading.Tasks;
 

namespace RazorMvcBooks.Models
{
    public class Book
    {  

        public int ID { get; set; }
        public string Name { get; set; }

        [Display(Name = "出版日期")]
        [DataType(DataType.Date)] 

        public DateTime ReleaseDate { get; set; }

        public string Author { get; set; }
        public decimal Price { get; set; }
        public string Publishing { get; set; }

    }

}

          在Visual Studio 2017中按下(Ctrl+Shift+B)，或是菜單中選擇生成-->生成解決方案

 

 

二、給列表頁面添加Publishing字段

             在Visual Studio 2017的解決方案資源管理器中找到 Pages/Books/Index.cshtml文件，然后使用鼠標雙擊打開，並在文件中添加Publishing字段，代碼如下:

@page 
@model RazorMvcBooks.Pages.Books.IndexModel 

@{
    ViewData["Title"] = "Index";
} 

<h2>Index</h2>

<p>
    <a asp-page="Create">Create New</a>
</p>
<form>
    <p>
        <select asp-for="Author" asp-items="Model.Authors">
            <option value="">All</option>
        </select>
書籍名稱
         <input type="text" name="SearchString">
        <input type="submit" value="查詢" />
    </p>
</form>
 
<table class="table">
    <thead>
        <tr>
                <th>
                    @Html.DisplayNameFor(model => model.Book[0].Name)

                </th>
                <th>
                    @Html.DisplayNameFor(model => model.Book[0].ReleaseDate)

                </th>
                <th>
                    @Html.DisplayNameFor(model => model.Book[0].Author)

                </th>
                <th>
                    @Html.DisplayNameFor(model => model.Book[0].Price)

                </th>
            <th>
                @Html.DisplayNameFor(model => model.Book[0].Publishing)

            </th>
            <th></th>
        </tr>
    </thead>
    <tbody>
@foreach (var item in Model.Book) {
        <tr>
            <td>
                @Html.DisplayFor(modelItem => item.Name)

            </td>
            <td>
                @Html.DisplayFor(modelItem => item.ReleaseDate)

            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Author)

            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Price)

            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Publishing)

            </td>
            <td>

                <a asp-page="./Edit" asp-route-id="@item.ID">Edit</a> |

                <a asp-page="./Details" asp-route-id="@item.ID">Details</a> |
                <a asp-page="./Delete" asp-route-id="@item.ID">Delete</a>
            </td>
        </tr>
}
    </tbody>
</table>

 

      按照上面的方式，把Publishing字段添加到“Delete.cshtml”與“Details.cshtml”頁面中。

       接下來我們在Visual Studio 2017的解決方案資源管理器中打開Create.cshtml，然后選擇一個現成<div>元素（例如包含Name字段的div元素），復制，粘貼到如下圖的位置，最后把Name修改為Publishing字段。如下圖。

 

添加了Publishing字段之后 Create.cshtml  代碼如下:

@page
@model RazorMvcBooks.Pages.Books.CreateModel
@{

    ViewData["Title"] = "Create";
} 

<h2>Create</h2> 

<h4>Book</h4>
<hr />
<div class="row">
    <div class="col-md-4">
        <form method="post">
            <div asp-validation-summary="ModelOnly" class="text-danger"></div>

            <div class="form-group">
                <label asp-for="Book.Name" class="control-label"></label>

                <input asp-for="Book.Name" class="form-control" />
                <span asp-validation-for="Book.Name" class="text-danger"></span>
            </div>

            <div class="form-group">
                <label asp-for="Book.ReleaseDate" class="control-label"></label>
                <input asp-for="Book.ReleaseDate" class="form-control" />
                <span asp-validation-for="Book.ReleaseDate" class="text-danger"></span>
            </div>

            <div class="form-group">
                <label asp-for="Book.Author" class="control-label"></label>

                <input asp-for="Book.Author" class="form-control" />
                <span asp-validation-for="Book.Author" class="text-danger"></span>
            </div> 

            <div class="form-group">
                <label asp-for="Book.Price" class="control-label"></label>
                <input asp-for="Book.Price" class="form-control" />
                <span asp-validation-for="Book.Price" class="text-danger"></span>
            </div>
            <div class="form-group">
                <label asp-for="Book.Publishing" class="control-label"></label>
                <input asp-for="Book.Publishing" class="form-control" />

                <span asp-validation-for="Book.Publishing" class="text-danger"></span>
            </div>
            <div class="form-group">
                <input type="submit" value="Create" class="btn btn-default" />

            </div>
        </form>
    </div>
</div> 

<div>
    <a asp-page="Index">Back to List</a>
</div> 

@section Scripts {
    @{await Html.RenderPartialAsync("_ValidationScriptsPartial");}
}

 

      參照上面的方式給編輯頁面添加Publishing字段。

      在經過上面的修改之后，但是由於我們還沒有進行數據庫更新，所以此時運行書籍管理信息系統是會報錯的。

     此時如果我們在Visual Studio 2017中按下F5，在瀏覽器中我們會得到如下圖的錯誤信息。

         這個錯誤信息表明我們的實體類與數據庫中的表結構不一致。數據庫中Book表沒有Publishing字段。

 

三、有幾種方法可以解決這個錯誤

1、讓實體框架自動刪除並使用新的實體類重新創建數據庫。這種方法適合在開發周期的早期使用；它允許您快速地將實體類和數據庫表一起快速改進。缺點是丟失數據庫中的現有數據。請不要在生產數據庫上使用這種方法！在架構更改時刪除數據庫並使用初始化類自動地用測試數據生成數據庫中的數據，這通常是開發應用程序的一種有效方式。

2、通過SQL Server Management Studio顯式修改現有數據庫中的表，使之與實體類相匹配。這種方法的優點是可以保存數據。您可以手動或通過創建數據庫更改腳本來進行更改。

3、使用 Code First 遷移功能來更新數據庫。我們將在下一篇文章中進行學習。