命名空間:
X.PagedList 和 X.Web.PagedList:引入用於分页功能的命名空間。
empdemo.Models.Employees:指定 View 所使用的 Model 類型,也就是從 Controller 傳來的員工資料集合。
HTML
@{
ViewData["Title"] = "員工資料列表";
Layout = "_Layout";
}
請謹慎使用程式碼。
View 資料:
ViewData["Title"]:設定頁面的標題。
Layout = "_Layout":指定使用 _Layout 作為頁面的佈局。
HTML
Card 元件:
使用 Bootstrap 的 Card 元件,為整個資料列表區域加上一個外框。
HTML
分页器:
@Html.PagedListPager:這是 X.PagedList 提供的 Helper,用來產生分页連結。
(IPagedList)Model:將 Model 強制轉型為 IPagedList,以便使用分页功能。
x => Url.Action("Index", "Employee", new { area = "", page = x }):產生分页連結的 URL,當使用者點擊分页連結時,會重新呼叫 Employee Controller 的 Index Action,並傳入新的頁碼。
HTML
資料表格:
使用 HTML 的 標籤,將員工資料以表格形式呈現。
資料列迴圈:
遍歷 Model 中的每一筆員工資料,產生一個 標籤,並在其中顯示該筆資料的各欄位值。
HTML
@Html.ActionLink("修改", "Edit", "Employee", new { area = "", id = item.Id }, new { @class = "btn btn-success" })
請謹慎使用程式碼。
Action Link:
使用 @Html.ActionLink 產生一個連結,點擊後會呼叫 Employee Controller 的 Edit Action,並傳入該筆員工的 ID,以進行修改操作。