https://laihao2.com/Home/Contact19_List

ASP.NET開發操作流程:資料表設定好>再寫程式:加入資料庫>串聯資料庫>產生Models裡面類別檔dao>按:建置>Controllers裡面的Entities>產生畫面View

資料表~參考昨天的~

產生Models裡面類別檔dao>按:建置>

ProductDBContext.cs裡面要記得填入

public virtual DbSet<ContactForm> ContactForm { get; set; }

Controllers裡面的Entities>

public ActionResult Contact19_List()
        {
            ViewBag.Layout = "~/Views/Shared/_Layout.cshtml";
            var customers = _db.ContactForm.ToList();

            var ESGs = _db.ContactForm.ToList();

            

            return View(ESGs);

        }

解釋程式碼
這段 C# 代碼是一個 ASP.NET MVC 控制器中的 Action 方法 Contact19_List，它的作用是獲取 ContactForm 表中的所有記錄，並將這些記錄傳遞到視圖中顯示。我們可以逐行解釋這段代碼：

1. public ActionResult Contact19_List()
   這是一個定義在控制器中的 Action 方法，返回一個 ActionResult 對象。ActionResult 是 ASP.NET MVC 中的一個基類，用於表示不同類型的結果（比如視圖、重定向等）。

2. ViewBag.Layout = "~/Views/Shared/_Layout.cshtml";
   這行代碼是將視圖中的 Layout 設置為 "_Layout.cshtml" 文件。ViewBag 是一個動態對象，可以用來在控制器和視圖之間傳遞數據。這里是設置視圖的布局文件路徑。

3. var customers = _db.ContactForm.ToList();
   這行代碼從數據庫中獲取 ContactForm 表的所有記錄，並將它們存儲在變量 customers 中。_db 是數據庫上下文，ContactForm 是該數據庫上下文中的一個表。ToList() 會將數據從數據庫中拉取並轉換為一個列表。

4. var ESGs = _db.ContactForm.ToList();
   這行代碼和前面的一行相同，重新從 ContactForm 表獲取所有記錄，並將它們存儲在變量 ESGs 中。這里的變量名不同，但執行的操作相同。customers 變量沒有在後續代碼中使用，所以可以被認為是多余的。

5. return View(ESGs);
   這行代碼將變量 ESGs 中的 ContactForm 表記錄列表傳遞給視圖，並返回該視圖進行呈現。在視圖中，可以使用這個傳遞的數據來顯示記錄。

總結：

• 這段代碼的功能是從 ContactForm 表中獲取所有記錄並將它們傳遞到視圖中。
• 代碼中的 customers 變量是冗余的，因為後續並沒有使用它。

產生畫面View程式碼

@model IEnumerable<WebApplication5.Models.ContactForm>

@{
    Layout = "~/Views/Shared/_Layout.cshtml";
    ViewBag.Title = "Contact19_List";
}

<style>
    body {
        font-family: "Helvetica Neue", Arial, sans-serif;
        background-color: #f9f9f9;
        color: #333;
        margin: 0;
        padding: 0;
        line-height: 1.6;
    }

    .farm-wrapper {
        max-width: 800px;
        margin: 0 auto;
        padding: 20px;
        background-color: #fff;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    }

    h1, h2, h3 {
        font-weight: 300;
        color: #444;
        margin-bottom: 10px;
    }

    header {
        text-align: center;
        padding: 20px 0;
    }

    nav ul {
        list-style: none;
        padding: 0;
        margin: 0;
    }

        nav ul li {
            display: inline;
            margin-right: 15px;
        }

            nav ul li a {
                text-decoration: none;
                color: #666;
                font-weight: 400;
                transition: color 0.3s;
            }

                nav ul li a:hover {
                    color: #000;
                }

    main {
        padding: 20px 0;
        text-align: center;
    }

    table {
        width: 100%;
        border-collapse: collapse;
        margin: 20px 0;
    }

    th, td {
        padding: 10px;
        text-align: left;
        border-bottom: 1px solid #ddd;
    }

    th {
        background-color: #f1f1f1;
        font-weight: 500;
    }

    td {
        font-weight: 300;
    }

    footer {
        text-align: center;
        padding: 10px;
        font-size: 0.9em;
        color: #999;
    }
</style>

<div class="farm-wrapper">

    <header>
        <h1>我的網站</h1>
        <nav>
            <ul>
                <li><a href="#">首頁</a></li>
                <li><a href="#">關於我</a></li>
                <li><a href="#">作品</a></li>
                <li><a href="#">聯絡</a></li>
            </ul>
        </nav>
    </header>

    <main>
        <h2>歡迎來到我的網站</h2>
        <p>這是一個簡潔風格的網站範例。</p>

        <!-- 表格展示 ContactForm 資料 -->
        <table>
            <thead>
                <tr>
                    <th>@Html.DisplayNameFor(model => model.Name)</th>
                    <th>@Html.DisplayNameFor(model => model.Message)</th>
                </tr>
            </thead>
            <tbody>
                @foreach (var item in Model)
                {
                    <tr>
                        <td>@Html.DisplayFor(modelItem => item.Name)</td>
                        <td>@Html.DisplayFor(modelItem => item.Message)</td>
                    </tr>
                }
            </tbody>
        </table>
    </main>

   
</div>

解釋程式碼
這段程式碼是使用 ASP.NET MVC 框架來建立一個簡潔風格的網頁。它從 ContactForm 模型中顯示資料，並且包含一些 HTML 和 CSS 來設計頁面的佈局。以下是各部分的詳細解釋：

1. 頂部的 @model 宣告

@model IEnumerable<WebApplication5.Models.ContactForm>

這行代碼指定了這個視圖使用的模型，它是一個 IEnumerable 的 ContactForm 集合，也就是說，這個視圖接收的是一組 ContactForm 資料。

2. ViewBag.Title 和佈局設定

@{
    Layout = "~/Views/Shared/_Layout.cshtml";
    ViewBag.Title = "Contact19_List";
}

• Layout 設定了這個視圖會使用的佈局檔案 (_Layout.cshtml)。
• ViewBag.Title 定義了這個頁面的標題為 "Contact19_List"。

3. 樣式 (CSS)

<style>
    body { ... }
    .farm-wrapper { ... }
    h1, h2, h3 { ... }
    ...
</style>

這段內嵌的 CSS 定義了頁面整體的樣式：

• body 設定了全頁面的字體、背景色和文字顏色。
• .farm-wrapper 是一個容器，設置了最大寬度、內邊距和背景色，並加上了陰影，讓頁面中央內容有較好的視覺效果。
• h1, h2, h3 調整了標題的字重和顏色。
• table, th, td 定義了表格的樣式，包括邊框、內邊距以及標題行的背景色等。

4. 網頁結構

<div class="farm-wrapper">
    <header>
        <h1>我的網站</h1>
        <nav>
            <ul>
                <li><a href="#">首頁</a></li>
                <li><a href="#">關於我</a></li>
                <li><a href="#">作品</a></li>
                <li><a href="#">聯絡</a></li>
            </ul>
        </nav>
    </header>
    <main>
        <h2>歡迎來到我的網站</h2>
        <p>這是一個簡潔風格的網站範例。</p>
        <!-- 表格展示 ContactForm 資料 -->
        <table>
            <thead>
                <tr>
                    <th>@Html.DisplayNameFor(model => model.Name)</th>
                    <th>@Html.DisplayNameFor(model => model.Message)</th>
                </tr>
            </thead>
            <tbody>
                @foreach (var item in Model)
                {
                    <tr>
                        <td>@Html.DisplayFor(modelItem => item.Name)</td>
                        <td>@Html.DisplayFor(modelItem => item.Message)</td>
                    </tr>
                }
            </tbody>
        </table>
    </main>
</div>

• header 包含網站的標題 "我的網站" 和導航欄，這裡使用了未定義的鏈接（#）作為佔位符。
• main 中有歡迎訊息 "歡迎來到我的網站" 和一個簡短的描述。
• 表格部分展示 ContactForm 模型的資料，透過 @Html.DisplayNameFor 動態生成表格的列標題，@Html.DisplayFor 用來顯示模型中的 Name 和 Message 屬性的值。這裡使用了 foreach 來遍歷模型中的每一筆資料並顯示在表格中。

總結

這個程式碼呈現了一個簡單的網頁，它使用 ASP.NET MVC 框架來展示來自 ContactForm 模型的資料，並包含了標題、導航欄和表格資料。

大家明天見~