WebForm（二）——控件和數據庫連接方式，webform數據庫連接
一、簡單控件
1、Label（作用：顯示文字）
Web中：
<asp:Label ID="Label1" runat="server" Text="Label" BorderColor="Black" Border BorderWidth="5px"></asp:Label>
編譯完成後的元素時span（html）
<span id="Label1" >Label</span>
屬性：①BackColor：控件背景色 ；
②BorderColor：控件邊框顏色；
③BorderStyle：控件邊框樣式；
④BorderWidth：控件邊框寬度
2、Literal（作用：顯示文字）
Web中：
<asp:Literal ID="Literal1" runat="server" Text ="編譯後不會形成什麼元素"></asp:Literal>
編譯後不會形成什麼元素（一般用來後台輸出js代碼）
</div>
編譯後不會形成什麼元素
3、TextBox（文字輸入框）
屬性：①TextMode：文本礦的行為模式，有以下幾種模式：
★默認SingleLine：單行。
Web中：
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
編譯後：
<input name="TextBox1" type="text" id="TextBox1" />
★Password：密碼框
Web中：
<asp:TextBox ID="TextBox1" runat="server" TextMode="Password"></asp:TextBox>
編譯後：
<input name="TextBox1" type="password" id="TextBox1" />
★Multiline：文本域
Web中：
<asp:TextBox ID="TextBox1" runat="server" TextMode="MultiLine"></asp:TextBox>
編譯後textarea：
<textarea name="TextBox1" rows="2" cols="20" id="TextBox1">
②warp：換行（true：換行；false：不換行）
③Enabled：控件啟用狀態
④Readonly：是否可以更改控件中的文本
⑤Maxlength：限制最長長度；比如：密碼限制多少位，就可以更改此屬性
4、按鈕類
（1）Button：
Web中：
<asp:Button ID="Button1" runat="server" Text="Button" />
編譯後submit：
<input type="submit" name="Button1" value="Button" id="Button1" />
屬性：Onclintclick：比如：在onclintclick後面加上alert("nihao");
編譯後是：
<input type="submit" name="Button1" value="Button" onclick="alert("nihao");" id="Button1" />
注：
<asp:Button ID="Button1" runat="server" Text="Button" OnClientClick='if(confirm("是否要提交？")){return false;}' />
Confirm()：
confirm() 方法用於顯示一個帶有指定消息和OK 及取消按鈕的對話框。
如果用戶點擊確定按鈕，則confirm() 返回true。如果點擊取消按鈕，則confirm() 返回false。
在用戶點擊確定按鈕或取消按鈕把對話框關閉之前，它將阻止用戶對浏覽器的所有輸入。在調用confirm() 時，將暫停對JavaScript 代碼的執行，在用戶作出響應之前，不會執行下一條語句。
下面我們通過這兩個小例子，來了解一下它的使用方法吧：
![]()
<head>
<title>confrim 的使用方法</title>
<script type="text/javascript">
function clear1()
{
if(confirm("確定要清空數據嗎？"))
{
document.main.text1.value="";
}
}
</script>
</head>
<boty>
<form name="main">
<input type="text" name="text1"/>
<input type="button" name="submit" value="數據清空" onclick="return clear1()"/>
</form>
</body>
confirm()使用方法
（2）ImageButton：圖片按鈕
屬性同Button類似，多以個ImageUrl屬性，此屬性用於存放圖片地址。
（3）LinkButton：被編輯成超鏈接模樣的按鈕，
注：①HyperLink：超鏈接控件（不經常用此方式見超鏈接）
②邊框注意：邊框顏色——邊框樣式——邊框粗細
二、數據庫連接樣式
例：做一個登錄頁面，連接數據庫，判斷是否登錄成功。
實體類：
![]()
/// <summary>
/// Users 的摘要說明
/// </summary>
public class Users
{
public Users()
{
//
// TODO: 在此處添加構造函數邏輯
//
}
private string _UserName;
/// <summary>
/// 賬號
/// </summary>
public string UserName
{
get { return _UserName; }
set { _UserName = value; }
}
private string _Parssword;
/// <summary>
/// 密碼
/// </summary>
public string Parssword
{
get { return _Parssword; }
set { _Parssword = value; }
}
}
實體類
數據訪問類：
![]()
/// <summary>
/// UsersDA 的摘要說明
/// </summary>
public class UsersDA
{
SqlConnection conn = null;
SqlCommand cmd = null;
public UsersDA()
{
conn = new SqlConnection("server=.;database=mydb;user=sa;pwd=128712jdhlys");
cmd = conn.CreateCommand();
}
/// <summary>
/// 用戶驗證
/// </summary>
/// <param name="uname">用戶名驗證</param>
/// <param name="pwd">密碼驗證</param>
/// <returns></returns>
public bool Select(string uname, string pwd)
{
bool yanzheng = false;
cmd.CommandText = "select * from Users where UserName=@uname and Password=@pwd";
cmd.Parameters.Clear();
cmd.Parameters.Add("@uname",uname);
cmd.Parameters.Add("@pwd", pwd);
conn.Open();
SqlDataReader dr = cmd.ExecuteReader();
if (dr.HasRows)
{
yanzheng = true;
}
conn.Close();
return yanzheng;
}
}
訪問類
注：●創建的類要放在App_Code文件夾中，一般不需要自己創建，建類時會有提示。
●web沒有命名空間
Web中代碼：
![]()
<body>
<form id="form1" runat="server">
賬號：<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox><br />
密碼：<asp:TextBox ID="TextBox2" runat="server" TextMode="Password"></asp:TextBox><br />
<asp:Button ID="Button1" runat="server" Text="登錄" />
<asp:Literal ID="Literal1" runat="server"></asp:Literal>
</form>
</body>
.aspx
![]()
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
Button1.Click += Button1_Click;//登錄按鈕事件
}
void Button1_Click(object sender, EventArgs e)
{
string zh = TextBox1.Text;
string mm = TextBox2.Text;
bool yanz = new UsersDA().Select(zh, mm);
//法一，無彈窗
if (yanz)
Literal1.Text = "登陸成功！";
else
Literal1.Text = "用戶名或密碼錯誤！";
//法二,有彈窗
//if (yanz)
// Literal1.Text = "<script>alert('登陸成功!')</script>";
//else
// Literal1.Text = "<script>alert('用戶名或密碼錯誤!')</script>";
}
}
.aspx.cs
三、復合控件
首先建兩個類，下面的復合控件將會用到！
實體類：
![]()
/// <summary>
/// Nation 的摘要說明
/// </summary>
public class Nation
{
public Nation()
{
//
// TODO: 在此處添加構造函數邏輯
//
}
private string _NationCode;
/// <summary>
/// 民族編號
/// </summary>
public string NationCode
{
get { return _NationCode; }
set { _NationCode = value; }
}
private string _NationName;
/// <summary>
/// 民族名稱
/// </summary>
public string NationName
{
get { return _NationName; }
set { _NationName = value; }
}
}
Nation
數據訪問類：
![]()
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Data.SqlClient;
/// <summary>
/// NationData 的摘要說明
/// </summary>
public class NationDA
{
SqlConnection conn = null;
SqlCommand cmd = null;
public NationData()
{
conn = new SqlConnection("server=.;database=Data0617;user=sa;pwd=123");
cmd = conn.CreateCommand();
}
/// <summary>
/// 返回全部Nation表數據集合
/// </summary>
/// <returns></returns>
public List<Nation> Select()
{
List<Nation> list = new List<Nation>();
cmd.CommandText = "select *from Nation";
conn.Open();
SqlDataReader dr = cmd.ExecuteReader();
if (dr.HasRows)
{
while (dr.Read())
{
Nation n = new Nation();
n.NationCode = dr["NationCode"].ToString();
n.NationName = dr["NationName"].ToString();
list.Add(n);
}
}
conn.Close();
return list;
}
NationDA
（一）DropDownList：下拉列表框
Web顯示：
<asp:DropDownList ID="DropDownList1" runat="server"></asp:DropDownList>
編譯後select：
<select name="DropDownList1" id="DropDownList1">
</select>
1、給DropDownList寫入數據（兩種方法）——放在Page_Load中
法一：與winform中給下拉表框填數據類似（DataSource）
![]()
protected void Page_Load(object sender, EventArgs e)
{
DropDownList1.DataSource = new NationData().Select();//數據源指向
DropDownList1.DataTextField = "NationName";//顯示字段綁定
DropDownList1.DataValueField = "NationCode";//隱藏字段綁定
DropDownList1.DataBind();
}
DataSource
法二：Foreach遍歷，同時加上默認選中
![]()
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
List<Nation> Nlist = new NationData().Select();
foreach (Nation n in Nlist)
{
ListItem li = new ListItem(n.NationName, n.NationCode);
if (li.Value == "N003")
{
li.Selected = true;
}
DropDownList1 . Items.Add(li);
}
}
}
foreach
編譯後顯示：
![]()
<select name="DropDownList1" id="DropDownList1">
<option value="N001">漢族</option>
<option value="N002">滿族</option>
<option selected="selected" value="N003">藏族</option>
<option value="N004">彝族</option>
</select>
編譯後
注：加一個Button和Label，點擊按鈕時，將取到的value或text顯示在label上。下面用到
2、取DropDownList的Value或者text（只能取一條數據的value或text）
![]()
void Button1_Click(object sender, EventArgs e)
{
Label1.Text = DropDownList1.SelectedItem.Value;
//Label1.Text = DropDownList1.SelectedItem.Text;
}
取一條數據
3、取多條數據（ListBox控件）
ListBox控件（此控件可以取一條或多條數據）——編譯後也是select（下拉列表框）
屬性：SelectionMode（列的選擇模式）——single：單行，只單選；Multiple：多行，可多選。
ListBox綁定數據的方法同DropDownList一樣。
ListBox取數據的方法：
![]()
void Button1_Click(object sender, EventArgs e)
{
string end = "";
foreach (ListItem li in ListBox1.Items)
{
if (li.Selected)
{
end += li.Text + " - " + li.Value + ",";
}
}
Label1.Text = end;
}
listbox取數據
（二）CheckBoxList：多選列表
<asp:CheckBoxList ID="CheckBoxList1" runat="server" RepeatLayout="UnorderedList"></asp:CheckBoxList>
屬性：①RepeatColumns：一行最多顯示多少個數據
②RepeatDirection——Vetical：垂直顯示 ； Horizontal：水平顯示
④RepeatLayout：Table → 用table布局
Flow → 用span布局
UnorderedList → 無序列表
OrderedList → 有序列表
用法同DropDownList和ListBox！
（三）RadioButtonList
<asp:RadioButtonList ID="RadioButtonList1" runat="server"></asp:RadioButtonList>
屬性同CheckBoxList類似，用法同DropDownList和ListBox！
四、http協議無狀態性
每一次事件提交，都會將頁面刷新，刷新就必走Load事件，進而出現重復綁定的情況
解決方法：判斷頁面是第一次加載，還是由已經加載出來的頁面中的某個按鈕執行了提交返回回來的
if (!IsPostBack)
{ load事件中95%的代碼都要寫在這裡面，委托點擊事件除外！ }
後注：★控件中，name用於服務端 ， id用於客戶端，
未完待續！！！！！！！
