ASP.NET 網頁程式設計 (使用 C#)
CSIE NTU
.NET 資料提供者
.NET 資料提供者為存取資料來源的一組類別
.NET Data Provider
SQL .NET Data Provider
命名空間︰System.Data.SqlClient
可用資料庫︰MS-SQL
OLE DB .NET Data Provider
命名空間︰ System.Data.OleDb
可用資料庫︰ Dbase、FoxPro、Excel、Access、Oracle、
Access…
ODBC .NET Data Provider
實例探討 sample3-a1 (1)
程式功能
建立與資料庫間的連線
程式內容
private void Page_Load(object sender, System.EventArgs e) {
Response.Write("尚未連線..<br>");
Response.Write("進行連線..<br>");
AccessDataSource conn =
new AccessDataSource(Server.MapPath("member.mdb"),
實例探討 sample3-a1 (2)
程式內容
conn.DataBind();
GridView1.DataSourceID = "";
GridView1.DataSource = conn;
GridView1.DataBind();
Response.Write("連線成功..<br>");
}
DataSource 物件
物件可以用來執行所要對資料庫操作的命令
可傳入 SQL 命令
常用方法
Select
Update
Insert
Delete
SQL 結構化查詢語言
SQL 結構化查詢語言是一套標準的語言,用以 管理或存取資料庫
SQL 主要包含二部份
DML 資料處理語言
包含 SELECT、INSERT、UPDATE 及 DELETE…
DDL 資料定義語言
包含 CREATE、DROP、ALTER 及 GRANT…
SQL 語法–SELECT
SELECT 查詢命令可用來取得資料表中的資料
語法
SELECT 欄位名稱1, 欄位名稱2, … FROM 資料表 名稱 WHERE 條件式 ORDER BY 欄位名稱 (字串 需以單引號 ' 括住表示之)
用法
select * from student
select id,name from student order by id desc
實例探討 sample3-a2 (1)
程式功能
會員管理系統
程式內容–WebForm1.aspx
protected void loginBTN_Click(object sender, System.EventArgs e)
{
if(idTB.Text!= "" && pwTB.Text != "") {
if(check(idTB.Text, pwTB.Text))
Response.Redirect("WebForm2.aspx");
else
實例探討 sample3-a2 (2)
程式內容–WebForm1.aspx
else
messageLB.Text = "帳號密碼不可空白!!";
}
實例探討 sample3-a2 (3)
程式內容– WebForm1.aspx
private bool check(string id, string pw) {
bool flag = false;
string dataSource = Server.MapPath("member.mdb");
string connectionStr =
"Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" +
dataSource;
實例探討 sample3-a2 (4)
string sqlStr = "select * from member ";
sqlStr += "where id='" + id + "' and pw='" + pw + "'";
AccessDataSource conn = new AccessDataSource(dataSource, sqlStr);
GridView grid = new GridView();
grid.DataSource = conn;
grid.DataBind();
if (grid.Rows.Count > 0) flag = true;
課堂練習 sample3-b1
資料庫內容
建立一討論區資料表
包含識別碼、主題、內容、發表者、瀏覽人數及 回覆人數六個欄位
程式功能
建立討論區主題列表畫面
基本概念
利用 select 語法取得資料表中資料
SQL 語法–INSERT
INSERT 新增命令用來新增一筆資料至指定資料 表中
語法
INSERT INTO 資料表名稱 ( 欄位名稱1, 欄位名稱 2, …) VALUES ('資料1', '資料2', …)
用法
INSERT INTO student(id, name) VALUES(3, 'Ives')
實例探討 sample3-a3 (1)
程式功能
新增會員帳號
程式內容–WebForm1.aspx
AccessDataSource conn;
實例探討 sample3-a3 (2)
程式內容– WebForm1.aspx
private void Page_Load(object sender, System.EventArgs e)
{
upDG();
}
實例探討 sample3-a3 (3)
程式內容–WebForm1.aspx
private void upDG() {
string dataSource = Server.MapPath("member.mdb");
string SqlCmd = "select * from member";
conn = new AccessDataSource(dataSource, SqlCmd);
memberDG.DataSource = conn;
實例探討 sample3-a3 (4)
程式內容– WebForm1.aspx
private void addBTN_Click(object sender, System.EventArgs e) {
if(idTB.Text!="" && pwTB.Text!="") {
conn.InsertCommand =
"insert into member(id,pw)values('" + idTB.Text + "','" + pwTB.Text + "')";
conn.Insert();
memberDG.DataBind();
課堂練習 sample3-b2
程式功能
延續 sample3-b1 加入一超連結至 WebForm2
在 WebForm2 中設計發表新文章頁面
基本概念
利用 insert 語法新增文章至資料表中
畫面只提供作者主題及文章內容輸入功能
SQL 語法–DELETE
DELETE 刪除命令用來刪除資料表中的指定資料
語法
DELETE FROM 資料表名稱 WHERE 條件式
用法
DELETE FROM student WHERE id = 3 AND name =
'Ives'
刪除資料行
刪除資料行提供刪除資料功能
文字–欲顯示的文字 (全一致)
文字欄位–欲顯示的資料內容 (繫結)
用法
當刪除資料行中的按鈕被點選時,會引發 DeleteCommand 事件
DeleteCommand 事件會將選取到的資料列傳入事件 參數 e 當中
可在該事件中撰寫修改資料庫資料相關程式
實例探討 sample3-a4 (1)
程式功能
刪除會員帳號
程式內容
AccessDataSource conn;
實例探討 sample3-a4 (2)
程式內容– WebForm1.aspx
private void Page_Load(object sender, System.EventArgs e)
{
upDG();
}
實例探討 sample3-a4 (3)
程式內容–WebForm1.aspx
private void upDG() {
string dataSource = Server.MapPath("member.mdb");
string SqlCmd = "select * from member";
conn = new AccessDataSource(dataSource, SqlCmd);
memberDG.DataSource = conn;
memberDG.DataBind();
}
實例探討 sample3-a4 (4)
程式內容
protected void memberDG_RowDeleting(object sender, GridViewDeleteEventArgs e)
{
conn.DeleteCommand =
"DELETE FROM member WHERE id ='" +
memberDG.Rows[e.RowIndex].Cells[1].Text + "'";
conn.Delete();
memberDG.DataBind();
}
課堂練習 sample3-b3
程式功能
設計討論區刪除主題功能
在每一資料列加入刪除按鈕
設計全部刪除按鈕
基本概念
利用 delete 語法刪除資料
利用刪除資料行建立刪除按鈕
SQL 語法–UPDATE
UPDATE 更新命令用來修改資料表中的資料
語法
UPDATE 資料表名稱 SET 欄位1 = 資料1, 欄位2 = 資料2, … WHERE 條件式
用法
UPDATE student SET name = 'Bob' WHERE id = 2
編輯、更新、取消資料行
刪除資料行提供刪除資料功能
編輯文字–設定編輯按鈕顯示文字
更新文字–設定更新按鈕顯示文字
取消文字–設定取消按鈕顯示文字
用法
當編輯按鈕被點選時,會引發 EditCommand 事件
EditCommand 事件會將選取到的資料列傳入事件參數 e 當中
可將 GridView 的 EditItemIndex 屬性設定為該選取資料列的索 引值 e.Item.ItemIndex 並重新執行繫結動作
編輯和取消按鈕被點選時,會引發 UpdateCommand 及 CancelCommand 事件,可在該事件中撰寫對應處理程式
實例探討 sample3-a5 (1)
程式功能
修改會員密碼
程式內容
AccessDataSource conn;
實例探討 sample3-a5 (2)
程式內容
private void Page_Load(object sender, System.EventArgs e)
{
if(!IsPostBack) upDG();
}
實例探討 sample3-a5 (3)
程式內容
private void upDG() {
string dataSource = Server.MapPath("member.mdb");
string SqlCmd = "select * from member";
conn = new AccessDataSource(dataSource, SqlCmd);
memberDG.DataSource = conn;
memberDG.DataBind();
實例探討 sample3-a5 (4)
程式內容
private void memberDG_EditCommand(object source,
System.Web.UI.WebControls.GridViewCommandEventArgs e) {
memberDG.EditItemIndex = e.Item.ItemIndex;
upDG();
}
private void memberDG_CancelCommand(object source,
System.Web.UI.WebControls.GridViewCommandEventArgs e) {
memberDG.EditItemIndex = -1;
實例探討 sample3-a5 (5)
程式內容
private void memberDG_UpdateCommand(object source,
System.Web.UI.WebControls.GridViewCommandEventArgs e) {
string id = memberDG.Rows[e.NewEditIndex].Cells[1].Text;
string pw = TextBox.Text;
conn.UpdateCommand = "UPDATE member SET pw='" + pw + "' WHERE id='" + id + "'";
conn.Update();
memberDG.DataBind();
課堂練習 sample3-b4
程式功能
設計討論區修改主題功能
將資料列主題設定為選取按鈕
將選取項目顯示於文字方塊中
提供一修改按鈕
基本概念
利用 Update 語法修改資料
利用選取資料行建立選取按鈕
樣板資料行 (1)
GridView 中的樣板資料行可加入任意的控制
項,允許我們自由的設計資料顯示方式
樣板資料行 (2)
在 GridView 控制項中
點選右鍵,可在『編
輯樣板』選項中選取
欲編輯的樣板資料行
樣板資料行 (3)
在樣板編輯視窗中,從 工具箱拖曳 LinkButton 控 制項至 ItemTemplate 項 目中
將該 LinkButton 控制項
CommandName 屬性設
定為 select
樣板資料行 (4)
點選 LinkButton 控制
項的 (DataBindings)
屬性,在自訂繫結
運算式視窗中,加
入繫結語法
樣板資料行 (5)
同樣繫結樣板資料
行中的 Image 控制
項
實例探討 sample3-a6 (1)
程式功能
藝人簡介
點選藝人名稱導至該藝人詳細資料頁面
程式內容
利用 GridView 中的樣板資料行加入 一 LinkButton 及 Image 控制項,用來連結藝人詳細資料頁面及 顯示藝人照片縮圖
利用 FindControl 方法取得被選取資料列中樣板資
實例探討 sample3-a6 (2)
程式內容– WebForm1.aspx
protected void GridView1_RowCommand(object sender, GridViewCommandEventArgs e)
{
if (e.CommandName == "Select") {
Session.Add
("name",((Button)e.CommandSource).Text);
Response.Redirect("WebForm1.aspx");
實例探討 sample3-a6 (3)
程式內容–WebForm2.aspx
protected void Page_Load(object sender, EventArgs e) {
string name = Session["name"].ToString();
string SqlStr =
"select * from member where name= '"+name+"'";
AccessDataSource conn = new
AccessDataSource(Server.MapPath("member.mdb"),SqlStr);
實例探討 sample3-a6 (4)
conn.DataBind();
GridView temp = new GridView();
temp.DataSource = conn;
temp.DataBind();
Response.Write(temp.Rows[0].Cells[0].Text + temp.Rows[0].Cells[1].Text);
Image1.ImageUrl =
Server.MapPath(temp.Rows[0].Cells[2].Text.ToString());
}
課堂練習 sample3-b5
程式功能
更新瀏覽人數資料
基本概念
利用 GridView 中的樣板資料行加入 一 LinkButton 控制項
點選該控制項時連接資料庫更新瀏覽人數欄位資 料
利用 dataReader["欄位名稱"] 取得資料表中資料並
DataList 控制項 (1)
DataList 控制項可使用樣板與樣式定義的格式來 顯示資料
常用屬性
DataSource–設定資料來源
常用方法
DataBind–進行資料繫結動作
DataList 控制項 (2)
在 DataList 控制項上點選右鍵,選擇欲編輯的
樣板區塊
DataList 控制項 (3)
項目樣板的編輯畫面中,可以 在 ItemTemplate 中設定欲顯示 的資料格式
可利用 HTML 控制項中的 Table 控制項進行排版動作
(最好將 Table 格式設定好後,
再拖曳至 DataList 的
ItemTemplate 項目中)
實例探討 sample3-a7 (1)
程式功能
購物清單
程式內容
private void Page_Load(object sender, System.EventArgs e) {
if(!IsPostBack) {
string dataSource = Server.MapPath("db1.mdb");
string sqlStr = "select * from shopping ";
AccessDataSource conn = new
AccessDataSource(dataSource,sqlStr);
實例探討 sample3-a7 (2)
程式內容
conn.DataBind();
shoppingDL.DataSource = conn;
shoppingDL.DataBind();
} }
實例探討 sample3-a7 (3)
程式內容
protected 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);
課堂練習 sample3-b6
程式功能
延續 sample3-b5
利用 DataList 控制項顯示文章內容
基本概念
利用 HTML 控制項中的 Table 控制項設定欲顯示畫面
在 Table 控制項中放置 Web 控制項中的 Label 控制項,設
定該 Label 控制項的資料繫結運算式,以顯示資料表中資
料
最後將 Table 控制項拖曳至 DataList 的 ItemTemplate 項目中 主程式需設定 DataList 的 DataSource 屬性及進行 DataBind
常用樣板
ItemTemplate
設計控制項中每一列資料的外觀
AlternatingItemTemplate
類似 ItemTemplate 樣板,此樣板為每隔一資料列 的方式呈現
EditItemTemplate
設計編輯模式資料列的外觀
SelectedItemTemplate
實例探討 sample3-a8 (1)
程式功能
購物清單
程式內容
private void Page_Load(object sender, System.EventArgs e) {
string dataSource = Server.MapPath("db1.mdb");
string sqlStr = "select * from shopping " ;
conn = new AccessDataSource(dataSource, sqlStr);
if(!IsPostBack)
實例探討 sample3-a8 (2)
程式內容
private void upDL() {
shoppingDL.DataSource = conn;
shoppingDL.DataBind();
}
private void shoppingDL_SelectedIndexChanged(object sender, System.EventArgs e)
{
課堂練習 sample3-b7
程式功能
利用 DataList 控制項設計學生成績表
以二行不同色彩方式顯示學生成績並提供編輯功能
基本概念
利用 HTML 控制項中的 Table 控制項設定欲顯示畫面
在 DataList 的 ItemTemplate 及 AlternatingItemTemplate 項目 中置入不同樣式格式
設計 EditItemTemplate 項目
使用者控制項
使用者控制項允許我們自訂所需的控制項形 式
設計使用者控制項
在方案總管專案名稱上點選右鍵來加入使用者 控制項
可藉由 HTML 控制項中的 GridLayoutPanel 來進 行絕對座標排版
引用使用者控制項
加入使用者控制項 (1)
在專案名稱上點選右鍵,即可加入一使用者控
制項
加入使用者控制項 (2)
在加入新項目視窗中,選取 Web 使用者控制項
項目
加入使用者控制項 (3)
成功加入後,方案總管中即會產生一副檔名為
ascx 的使用者控制項檔案
實例探討 sample3-a9
程式功能
登入帳號密碼檢驗
程式內容– WebUserControl1.ascx
private void submitBTN_Click(object sender, System.EventArgs e) {
if(idTB.Text == "alice" && pwTB.Text == "alice") messageLB.Text = "登入成功";
else
messageLB.Text = "資料錯誤";
存取使用者控制項成員內容
如果需要在引用的程式碼中,存取使用者控制 項的欄位屬性值,或是呼叫方法時,必須在引 用的程式碼中先宣告該使用者控制
宣告方式
public 使用者控制項類別名 使用者控制項 ID;
public WebUserControl1 myControl;
課堂練習 sample3-b8
程式功能
登入系統
基本概念
利用 UserControl 建立一登入控制項,允許使用者 設定資料庫、資料表及登入成功連結網頁等資訊
在主程式中設定上述參數資訊
其它控制項繫結
部份具有 ListItem 型別 Items 屬性的控制項,也 可透過資料繫結的方式來設定 Items 屬性資料
常用屬性
DataSource–設定資料來源
DataTextField–繫結 Text 欄位
DataValueField–繫結 Value 欄位
常用方法
DataBind–進行資料繫結動作
實例探討 sample3-a10 (1)
程式功能
帳號資料
程式內容
private void Page_Load(object sender, System.EventArgs e)
{
string dataSource = Server.MapPath("member.mdb");
string SqlStr = "select * from member";
conn =
new AccessDataSource(dataSource, SqlStr);
if(!IsPostBack) upDG();
實例探討 sample3-a10 (2)
程式內容
private void upDG() {
memberLB.DataSource = dataReader;
memberLB.DataTextField = "account";
memberLB.DataBind();
}
實例探討 sample3-a10 (3)
程式內容
private void memberLB_SelectedIndexChanged(object sender, System.EventArgs e) {
conn.SelectCommand =
"select * from member where account='" + memberLB.SelectedItem.Text + "'";
conn.Select(new DataSourceSelectArguments());
conn.DataBind();
GridView a = new GridView();
a.DataSource = conn;
a.DataBind();
if(a.Rows.Count > 0) {
idLB.Text = a.Rows[0].Cells[0].Text;
accountLB.Text = a.Rows[0].Cells[1].Text;
自訂分頁
較好的分頁設計,是只提取資料來源中所需顯 示的頁面資料
將 AllowPaging 及 AllowCustomPage 設定為 true
設定總資料筆數 VirtualItemCount 屬性
可利用 select top n 欄位名稱 from 資料表名稱
where not 欄位名稱 in (select top m 欄位名稱 from
資料表名稱) 取得第 m 筆資料之後的 n 筆資料
課堂練習 sample3-b9
程式功能
討論區列表
分頁查詢功能
基本概念
透過 e.NewPageIndex * PageSize 來求得需取得的 資料位置