WebForm（二）——控件和數據庫連接方式

本文轉載自查看原文 2016-09-20 23:14 1669 ASP.NET——WebForm

一、簡單控件

1、Label（作用：顯示文字）

Web中：

<asp:Label ID="Label1" runat="server" Text="Label" BorderColor="Black" BorderStyle="Solid" BorderWidth="5px"></asp:Label>

編譯完成后的元素時span（html）

<span id="Label1" style="display:inline-block;border-color:Black;border-width:5px;border-style:Solid;">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(&quot;nihao&quot;);" 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用於客戶端，

未完待續！！！！！！！

免責聲明！

本站轉載的文章為個人學習借鑒使用，本站對版權不負任何法律責任。如果侵犯了您的隱私權益，請聯系本站郵箱yoyou2525@163.com刪除。

猜您在找 WebForm 控件（一）、連接數據庫 SpringBoot和數據庫連接 python和數據庫連接和建表 web頁面和數據庫連接《C#和數據庫連接》 JDBC和數據庫連接池數據庫、數據源和數據庫連接池 jsp數據庫連接大全和數據庫操作封裝到Javabean IIS並發連接數和數據庫連接池 DatasourceUtils類:獲取連接池和數據庫連接