今天我們要從資料庫中抓取資料呈現在網頁上面,我們先看看成品展示:
上述的資料都是從SQL Server抓取出來的資料,在日常生活中例如蝦皮、momo等購物網站上的產品資訊也都是從資料庫中抓取資料傳送到頁面上的,我們將在MVC上實現這個功能。
我們在實作之前先來構建一下程式邏輯:
Controller
連接資料庫->將資料放到容器list中->傳送到前端頁面中
View
使用foreach迴圈將資料呈現出來
我們可以先事前準備好我們所需要的資料,先開啟SQL Server之後在之前建立的Login資料表內插入資料,輸入以下新增資料語法,之後按下執行insert into Login values('andy123','1234'),('jim','2345');
在Controller與view當中寫入以下程式碼:
view
在view中新增一個頁面,我將他取名為"seeall"
<h2>Seeall</h2>
@using new_project.Models;
@{
List<loginfo> users = ViewBag.users;
}
<h2>Login Information</h2>
<table class="table">
<thead>
<tr>
<th>Username</th>
<th>Password</th>
</tr>
</thead>
<tbody>
@foreach (loginfo user in users)
{
<tr>
<td>@user.Account</td> <!-- 顯示 Username -->
<td>@user.Password</td> <!-- 顯示 Password -->
</tr>
}
</tbody>
</table>
Controller
這邊的連接字串一樣要將密碼改成使用者密碼。
public ActionResult Seeall()
{
List<loginfo>users = new List<loginfo>();
string connstr = "Data Source=CSIE-TEST2;Initial Catalog=Student_data;User ID=TEST03;Password=*****;Encrypt=False";
SqlConnection conn = new SqlConnection(connstr);
conn.Open();
SqlCommand cmd = new SqlCommand("select * from Login");
cmd.Connection = conn;
SqlDataReader reader = cmd.ExecuteReader();
while (reader.Read()) // 逐行讀取查詢結果
{
loginfo user = new loginfo
{
Account = reader["Account"].ToString(), // 假設資料表中的欄位名是 Username
Password = reader["Password"].ToString() // 假設資料表中的欄位名是 Password
};
users.Add(user); // 將每一筆資料加入列表
}
ViewBag.users = users;
return View();
}
}
Model
public class loginfo
{
public string Account { get; set; }
public string Password { get; set; }
};
可以先測試是否可以運行,有幾個必需要注意的事項,
1.在Controller中的public ActionResult Seeall()必須與view的頁面的名稱相同都為seeall
2.sql語句當中的資料表一定要是Login或是自行設置的資料表名稱
總結:這篇旨在帶過程式邏輯以及實現的部分,在下一篇會介紹詳細的程式碼。