ASP.NET 網頁程式設計 (使用 C#)
講師︰唐士軒
CSIE NTU
.NET 資料提供者
z .NET 資料提供者為存取資料來源的一組類別 z .NET Data Provider
z SQL .NET Data Provider
z命名空間︰System.Data.SqlClient
z可用資料庫︰MS-SQL
z OLE DB .NET Data Provider
z命名空間︰System.Data.OleDb
z可用資料庫︰ Dbase、FoxPro、Excel、Access、Oracle、
Access…
z ODBC .NET Data Provider
z需至微軟網站另外下載
Connection 物件
z ADO.NET 的 Connection 物件用來連接資料來 源，代表使用者與資料來源間的連線
z 利用『連線字串』來描述所要連線的資料來源 z 連接 Access 資料庫連線字串格式
z Provider–Microsoft.Jet.OLEDB.4.0 z Data source–資料庫檔案所在路徑
z OleDbConnection 類別
z 常用屬性
zConnectionString–取得或設定連線字串 (可於建構式設定)
z 常用方法
zOpen–開啟資料庫連線
實例探討 sample3-a1 (1)
z 程式功能
z 建立與資料庫間的連線
z 程式內容
private void Page_Load(object sender, System.EventArgs e) {
Response.Write("尚未連線..<br>");
string dataSource = Server.MapPath("member.mdb");
string connectionStr = "Provider=Microsoft.Jet.OLEDB.4.0;
Data Source=" +dataSource;
實例探討 sample3-a1 (2)
z 程式內容
OleDbConnection conn =
new OleDbConnection(connectionStr);
Response.Write("進行連線..<br>");
conn.Open();
Response.Write("連線成功..<br>");
conn.Close();
Response.Write("關閉連線..<br>");
}
Command 物件
z Command 物件可以用來執行所要對資料庫操 作的命令
z 建構式中可傳入 SQL 命令及 Connection 物件 z 常用方法
z ExecuteReader
z用來執行 Command 物件中的 SQL 查詢語法– SELECT
z取得資料後會回傳一個 DataReader 物件供使用者瀏覽資料
z ExecuteNonQuery
z用來執行 Command 物件中的 SQL 新增、刪除及修改語
法–INSERT、DELETE 及 UPDATE
DataReader 物件
z DataReader 物件可用來逐一取得資料表中的資料 列內容
z 可利用 物件["欄位名稱"] 來取得特定欄位資料 z 常用屬性
z FieldCount–取得資料總筆數
z 常用方法
z Read–讀取下一筆資料，已至檔案結尾回傳 false，
尚未到達檔案結尾回傳 true z Close–關閉釋放此物件資源
z GetName–取得欄位名稱
SQL 結構化查詢語言
zSQL 結構化查詢語言是一套標準的語言，
用以管理或存取資料庫 zSQL 主要包含二部份
zDML 資料處理語言
z包含 SELECT、INSERT、UPDATE 及 DELETE…
zDDL 資料定義語言
z包含 CREATE、DROP、ALTER 及 GRANT…
SQL 語法–SELECT
zSELECT 查詢命令可用來取得資料表中 的資料
z語法
zSELECT 欄位名稱1, 欄位名稱2, … FROM 資料表名稱 WHERE 條件式 ORDER BY 欄 位名稱 (字串需以單引號 ' 括住表示之)
z用法
zselect * from student
zselect id,name from student order by id desc
實例探討 sample3-a2 (1)
z 程式功能
z 會員管理系統
z 程式內容–WebForm1.aspx
private void loginBTN_Click(object sender, System.EventArgs e)
{
if(idTB.Text!= "" && pwTB.Text != "") {
if(check(idTB.Text, pwTB.Text))
Response.Redirect("WebForm2.aspx");
else
messageLB.Text = "帳號密碼輸入錯誤!!";
實例探討 sample3-a2 (2)
z程式內容–WebForm1.aspx
else
messageLB.Text = "帳號密碼不可空白!!";
}
private bool check(string id, string pw) {
string dataSource = Server.MapPath("member.mdb");
string connectionStr =
"Provider=Microsoft.Jet.OLEDB.4.0;
Data Source=" +dataSource;
OleDbConnection conn = new
實例探討 sample3-a2 (3)
z 程式內容–WebForm1.aspx
string sqlStr = "select * from member " ;
sqlStr+= "where id='" + id + "' and pw='"+pw+"'";
OleDbCommand command = new OleDbCommand(sqlStr, conn);
conn.Open();
OleDbDataReader dataReader = command.ExecuteReader();
bool flag = dataReader.Read();
dataReader.Close();
conn.Close();
return flag;
實例探討 sample3-a2 (4)
z程式內容–WebForm2.aspx
private void Page_Load(object sender, System.EventArgs e) {
string dataSource = Server.MapPath("member.mdb");
string connectionStr =
"Provider=Microsoft.Jet.OLEDB.4.0;
Data Source=" +dataSource;
OleDbConnection conn = new
OleDbConnection(connectionStr);
實例探討 sample3-a2 (5)
z 程式內容–WebForm2.aspx
string sqlStr = "select * from member ";
OleDbCommand command = new OleDbCommand(sqlStr, conn);
conn.Open();
OleDbDataReader dataReader = command.ExecuteReader();
memberDG.DataSource = dataReader;
memberDG.DataBind();
dataReader.Close();
conn.Close();
}
課堂練習 sample3-b1
z資料庫內容
z建立一討論區資料表
z包含識別碼、主題、內容、發表者、瀏覽人 數及回覆人數六個欄位
z程式功能
z建立討論區主題列表畫面
z基本概念
z利用 select 語法取得資料表中資料
z需引用命名空間 System.Data.OleDb
SQL 語法–INSERT
zINSERT 新增命令用來新增一筆資料至指 定資料表中
z語法
zINSERT INTO 資料表名稱 ( 欄位名稱1, 欄位 名稱2, …) VALUES ('資料1', '資料2', …)
z用法
zINSERT INTO student(id, name) VALUES(3,
'Ives')
實例探討 sample3-a3 (1)
z程式功能
z新增會員帳號
z程式內容–WebForm1.aspx
private string connectionStr;
private OleDbConnection conn;
private OleDbCommand command;
實例探討 sample3-a3 (2)
z程式內容–WebForm1.aspx
private void Page_Load(object sender, System.EventArgs e) {
string dataSource = Server.MapPath("member.mdb");
connectionStr = "Provider=Microsoft.Jet.OLEDB.4.0;
Data Source=" +dataSource;
conn = new OleDbConnection(connectionStr);
command = new OleDbCommand("", conn);
upDG();
}
實例探討 sample3-a3 (3)
z程式內容–WebForm1.aspx
private void upDG() {
command.CommandText = "select * from member";
conn.Open();
OleDbDataReader dataReader = command.ExecuteReader();
memberDG.DataSource = dataReader;
memberDG.DataBind();
dataReader.Close();
conn.Close();
實例探討 sample3-a3 (4)
z 程式內容–WebForm1.aspx
private void addBTN_Click(object sender, System.EventArgs e)
{
if(idTB.Text!="" && pwTB.Text!="") {
command.CommandText = "insert into member(id, pw)values('"+ idTB.Text +"','"+ pwTB.Text +"')";
conn.Open();
command.ExecuteNonQuery();
conn.Close();
upDG();
課堂練習 sample3-b2
z程式功能
z延續 sample3-b1 加入一超連結至 WebForm2 z在 WebForm2 中設計發表新文章頁面
z基本概念
z利用 insert 語法新增文章至資料表中
z畫面只提供作者主題及文章內容輸入功能
SQL 語法–DELETE
zDELETE 刪除命令用來刪除資料表中的 指定資料
z語法
zDELETE FROM 資料表名稱 WHERE 條件式
z用法
zDELETE FROM student WHERE id = 3 AND
name = 'Ives'
刪除資料行
z刪除資料行提供刪除資料功能
z文字–欲顯示的文字 (全一致)
z文字欄位–欲顯示的資料內容 (繫結)
z用法
z當刪除資料行中的按鈕被點選時，會引發 DeleteCommand 事件
zDeleteCommand 事件會將選取到的資料列傳 入事件參數 e 當中
z可在該事件中撰寫修改資料庫資料相關程式
實例探討 sample3-a4 (1)
z程式功能
z刪除會員帳號
z程式內容
private string connectionStr;
private OleDbConnection conn;
private OleDbCommand command;
實例探討 sample3-a4 (2)
z 程式內容
private void Page_Load(object sender, System.EventArgs e) {
string dataSource = Server.MapPath("member.mdb");
connectionStr = "Provider=Microsoft.Jet.OLEDB.4.0;
Data Source=" +dataSource;
conn = new OleDbConnection(connectionStr);
command = new OleDbCommand("", conn);
upDG();
}
實例探討 sample3-a4 (3)
z 程式內容
private void upDG() {
command.CommandText = "select * from member";
conn.Open();
OleDbDataReader dataReader = command.ExecuteReader();
memberDG.DataSource = dataReader;
memberDG.DataBind();
dataReader.Close();
conn.Close();
}
實例探討 sample3-a4 (4)
z 程式內容
private void memberDG_DeleteCommand(object source,
System.Web.UI.WebControls.DataGridCommandEventArgs e) {
command.CommandText =
"DELETE FROM member WHERE id ='" + e.Item.Cells[1].Text + "'";
conn.Open();
command.ExecuteNonQuery();
conn.Close();
upDG();
}
課堂練習 sample3-b3
z程式功能
z設計討論區刪除主題功能 z在每一資料列加入刪除按鈕 z設計全部刪除按鈕
z基本概念
z利用 delete 語法刪除資料
z利用刪除資料行建立刪除按鈕
SQL 語法–UPDATE
zUPDATE 更新命令用來修改資料表中的 資料
z語法
zUPDATE 資料表名稱 SET 欄位1 = 資料1, 欄 位2 = 資料2, … WHERE 條件式
z用法
zUPDATE student SET name = 'Bob' WHERE
id = 2
編輯、更新、取消資料行
z 刪除資料行提供刪除資料功能
z 編輯文字–設定編輯按鈕顯示文字 z 更新文字–設定更新按鈕顯示文字 z 取消文字–設定取消按鈕顯示文字
z 用法
z 當編輯按鈕被點選時，會引發 EditCommand 事件
z EditCommand 事件會將選取到的資料列傳入事件參數 e 當中 z 可將 DataGrid 的 EditItemIndex 屬性設定為該選取資料列的索
引值 e.Item.ItemIndex 並重新執行繫結動作
z 編輯和取消按鈕被點選時，會引發 UpdateCommand 及 CancelCommand 事件，可在該事件中撰寫對應處理程式
z 在編輯狀態下，可編輯資料行會在欄位中加入 TextBox 控制 項顯示該欄位資料，欲取得內容必須將該欄位該控制項轉換
實例探討 sample3-a5 (1)
z程式功能
z修改會員密碼
z程式內容
private string connectionStr;
private OleDbConnection conn;
private OleDbCommand command;
實例探討 sample3-a5 (2)
z 程式內容
private void Page_Load(object sender, System.EventArgs e) {
string dataSource = Server.MapPath("member.mdb");
connectionStr =
"Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" +dataSource;
conn = new OleDbConnection(connectionStr);
command = new OleDbCommand("", conn);
實例探討 sample3-a5 (3)
z 程式內容
private void upDG() {
command.CommandText = "select * from member";
conn.Open();
OleDbDataReader dataReader = command.ExecuteReader();
memberDG.DataSource = dataReader;
memberDG.DataBind();
dataReader.Close();
conn.Close();
實例探討 sample3-a5 (4)
z 程式內容
private void memberDG_EditCommand(object source,
System.Web.UI.WebControls.DataGridCommandEventArgs e) {
memberDG.EditItemIndex = e.Item.ItemIndex;
upDG();
}
private void memberDG_CancelCommand(object source,
System.Web.UI.WebControls.DataGridCommandEventArgs e) {
memberDG.EditItemIndex = -1;
upDG();
實例探討 sample3-a5 (5)
z 程式內容
private void memberDG_UpdateCommand(object source,
System.Web.UI.WebControls.DataGridCommandEventArgs e) {
string id = e.Item.Cells[1].Text;
string pw = ((TextBox)e.Item.Cells[2].Controls[0]).Text;
command.CommandText = "UPDATE member SET pw='" + pw +
"' WHERE id='" + id +"'";
conn.Open();
command.ExecuteNonQuery();
conn.Close();
memberDG.EditItemIndex = -1;
upDG();
課堂練習 sample3-b4
z程式功能
z設計討論區修改主題功能
z將資料列主題設定為選取按鈕 z將選取項目顯示於文字方塊中 z提供一修改按鈕
z基本概念
z利用 Update 語法修改資料
z利用選取資料行建立選取按鈕
z利用 LinkButton 型別取得選取欄位文字內容
樣板資料行 (1)
zDataGrid 中的樣板資料行可加入任意的
控制項，允許我們自由的設計資料顯示
方式
樣板資料行 (2)
z在 DataGrid 控制項 中點選右鍵，可在
『編輯樣板』選項
中選取欲編輯的樣
板資料行
樣板資料行 (3)
z在樣板編輯視窗 中，從工具箱拖曳 LinkButton 控制項至 ItemTemplate 項目中 z將該 LinkButton 控
制項 CommandName
屬性設定為 select
樣板資料行 (4)
z點選 LinkButton 控制項的
(DataBindings) 屬 性，在自訂繫結 運算式視窗中，
加入繫結語法 DataBinder.Eval(
Container.DataItem,
“name＂)
樣板資料行 (5)
z同樣繫結樣板資 料行中的 Image 控制項
DataBinder.Eval
(Container.DataI
tem,"image")
實例探討 sample3-a6 (1)
z程式功能
z藝人簡介
z點選藝人名稱導至該藝人詳細資料頁面
z程式內容
z利用 DataGrid 中的樣板資料行加入 一
LinkButton 及 Image 控制項，用來連結藝人 詳細資料頁面及顯示藝人照片縮圖
z利用 FindControl 方法取得被選取資料列中
實例探討 sample3-a6 (2)
z 程式內容–WebForm1.aspx
private void Page_Load(object sender, System.EventArgs e)
{
string dataSource = Server.MapPath("member.mdb");
string connectionStr =
"Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" +dataSource;
OleDbConnection conn = new OleDbConnection(connectionStr);
string sqlStr = "select * from member " ; OleDbCommand command = new
OleDbCommand(sqlStr, conn);
實例探討 sample3-a6 (3)
z 程式內容–WebForm1.aspx
conn.Open();
OleDbDataReader dataReader = command.ExecuteReader();
memberDG.DataSource = dataReader;
memberDG.DataBind();
dataReader.Close();
conn.Close();
}
private void memberDG_SelectedIndexChanged(object sender, System.EventArgs e)
{
Response.Redirect("WebForm2.aspx?name="+((LinkButton)mem
實例探討 sample3-a6 (4)
z 程式內容–WebForm2.aspx
private void Page_Load(object sender, System.EventArgs e) {
string name = Request.QueryString["name"];
string dataSource = Server.MapPath("member.mdb");
string connectionStr = "Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" +dataSource;
OleDbConnection conn = new OleDbConnection(connectionStr);
string sqlStr = "select * from member " ; sqlStr+= "where name='" + name + "'";
OleDbCommand command = new OleDbCommand(sqlStr, conn);
實例探討 sample3-a6 (5)
z 程式內容–WebForm2.aspx
conn.Open();
OleDbDataReader dataReader = command.ExecuteReader();
if(dataReader.Read()) {
nameLB.Text = dataReader["name"].ToString();
countryLB.Text = dataReader["country"].ToString();
pictureIMG.ImageUrl = dataReader["image"].ToString();
}
dataReader.Close();
conn.Close();
課堂練習 sample3-b5
z程式功能
z更新瀏覽人數資料
z基本概念
z利用 DataGrid 中的樣板資料行加入 一 LinkButton 控制項
z點選該控制項時連接資料庫更新瀏覽人數欄 位資料
z利用 dataReader["欄位名稱"] 取得資料表中
資料並列印至網頁
DataList 控制項 (1)
zDataList 控制項可使用樣板與樣式定義的 格式來顯示資料
z常用屬性
zDataSource–設定資料來源
z常用方法
zDataBind–進行資料繫結動作
DataList 控制項 (2)
z在 DataList 控制項上點選右鍵，選擇欲
編輯的樣板區塊
DataList 控制項 (3)
z 項目樣板的編輯畫面中，
可以在 ItemTemplate 中 設定欲顯示的資料格式 z 可利用 HTML 控制項中
的 Table 控制項進行排版 動作
(最好將 Table 格式設定
好後，再拖曳至 DataList
的 ItemTemplate 項目中)
實例探討 sample3-a7 (1)
z 程式功能
z 購物清單
z 程式內容
private void Page_Load(object sender, System.EventArgs e) {
if(!IsPostBack) {
string dataSource = Server.MapPath("db1.mdb");
string connectionStr = "Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" +dataSource;
OleDbConnection conn = new OleDbConnection(connectionStr);
string sqlStr = "select * from shopping " ;
OleDbCommand command = new OleDbCommand(sqlStr, conn);
實例探討 sample3-a7 (2)
z 程式內容
conn.Open();
OleDbDataReader dataReader = command.ExecuteReader();
shoppingDL.DataSource = dataReader;
shoppingDL.DataBind();
dataReader.Close();
conn.Close();
}
實例探討 sample3-a7 (3)
z 程式內容
private void totalBTN_Click(object sender, System.EventArgs e) {
int total = 0;
foreach(DataListItem item in shoppingDL.Items) {
if(((CheckBox)item.FindControl("purchaseCB")).Checked) {
total +=
int.Parse(((Label)item.FindControl("costLB")).Text);
} }
totalLB.Text = total.ToString();
課堂練習 sample3-b6
z 程式功能
z 延續 sample3-b5
z 利用 DataList 控制項顯示文章內容
z 基本概念
z 利用 HTML 控制項中的 Table 控制項設定欲顯示畫面 z 在 Table 控制項中放置 Web 控制項中的 Label 控制
項，設定該 Label 控制項的資料繫結運算式，以顯示 資料表中資料
z 最後將 Table 控制項拖曳至 DataList 的 ItemTemplate 項目中
z 主程式需設定 DataList 的 DataSource 屬性及進行
常用樣板
zItemTemplate
z設計控制項中每一列資料的外觀
zAlternatingItemTemplate
z類似 ItemTemplate 樣板，此樣板為每隔一資 料列的方式呈現
zEditItemTemplate
z設計編輯模式資料列的外觀
zSelectedItemTemplate
z設計選取模式資料列的外觀
實例探討 sample3-a8 (1)
z 程式功能
z 購物清單
z 程式內容
private void Page_Load(object sender, System.EventArgs e) {
string dataSource = Server.MapPath("db1.mdb");
string connectionStr =
"Provider=Microsoft.Jet.OLEDB.4.0;Data Source="
+dataSource;
conn = new OleDbConnection(connectionStr);
string sqlStr = "select * from shopping " ;
command = new OleDbCommand(sqlStr, conn);
if(!IsPostBack)
實例探討 sample3-a8 (2)
z 程式內容
private void upDL() {
conn.Open();
OleDbDataReader dataReader = command.ExecuteReader();
shoppingDL.DataSource = dataReader;
shoppingDL.DataBind();
dataReader.Close();
conn.Close();
}
private void shoppingDL_SelectedIndexChanged(object sender, System.EventArgs e)
{
課堂練習 sample3-b7
z 程式功能
z 利用 DataList 控制項設計學生成績表
z 以二行不同色彩方式顯示學生成績並提供編輯功能
z 基本概念
z 利用 HTML 控制項中的 Table 控制項設定欲顯示畫面 z 在 DataList 的 ItemTemplate 及
AlternatingItemTemplate 項目中置入不同樣式格式 z 設計 EditItemTemplate 項目
使用者控制項
z使用者控制項允許我們自訂所需的控制 項形式
z設計使用者控制項
z在方案總管專案名稱上點選右鍵來加入使用 者控制項
z可藉由 HTML 控制項中的 GridLayoutPanel 來進行絕對座標排版
z引用使用者控制項
z從方案總管中將使用者控制項拖曳至設計畫
面即可
加入使用者控制項 (1)
z在專案名稱上點選右鍵，即可加入一使
用者控制項
加入使用者控制項 (2)
z在加入新項目視窗中，選取 Web 使用者
控制項項目
加入使用者控制項 (3)
z成功加入後，方案總管中即會產生一副
檔名為 ascx 的使用者控制項檔案
實例探討 sample3-a9
z 程式功能
z 登入帳號密碼檢驗
z 程式內容–WebUserControl1.ascx
private void submitBTN_Click(object sender, System.EventArgs e) {
if(idTB.Text == "alice" && pwTB.Text == "alice") messageLB.Text = "登入成功";
else
messageLB.Text = "資料錯誤";
messageLB.Visible = true;
}
存取使用者控制項成員內容
z如果需要在引用的程式碼中，存取使用者 控制項的欄位屬性值，或是呼叫方法時，
必須在引用的程式碼中先宣告該使用者控 制
z宣告方式
zpublic 使用者控制項類別名 使用者控制項 ID;
zpublic WebUserControl1 myControl;
課堂練習 sample3-b8
z程式功能
z登入系統
z基本概念
z利用 UserControl 建立一登入控制項，允許使 用者設定資料庫、資料表及登入成功連結網頁 等資訊
z在主程式中設定上述參數資訊
其它控制項繫結
z部份具有 ListItem 型別 Items 屬性的控制 項，也可透過資料繫結的方式來設定
Items 屬性資料 z常用屬性
zDataSource–設定資料來源
zDataTextField–繫結 Text 欄位 zDataValueField–繫結 Value 欄位
z常用方法
zDataBind–進行資料繫結動作
實例探討 sample3-a10 (1)
z 程式功能 z 帳號資料 z 程式內容
private void Page_Load(object sender, System.EventArgs e) {
string dataSource = Server.MapPath("member.mdb");
connectionStr = "Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" +dataSource;
conn = new OleDbConnection(connectionStr);
command = new OleDbCommand("", conn);
if(!IsPostBack) upDG();
}
實例探討 sample3-a10 (2)
z 程式內容
private void upDG() {
conn.Open();
command.CommandText = "select * from member";
OleDbDataReader dataReader = command.ExecuteReader();
memberLB.DataSource = dataReader;
memberLB.DataTextField = "account";
memberLB.DataBind();
dataReader.Close();
實例探討 sample3-a10 (3)
z 程式內容
private void memberLB_SelectedIndexChanged(object sender, System.EventArgs e)
{
conn.Open();
command.CommandText = "select * from member where account='" + memberLB.SelectedItem.Text + "'";
OleDbDataReader dataReader = command.ExecuteReader();
if(dataReader.Read()) {
idLB.Text = dataReader["id"].ToString();
accountLB.Text = dataReader["account"].ToString();
pwLB.Text = dataReader["pw"].ToString();
}
dataReader.Close();
conn.Close();
