WebForm（二）——控件和数据库连接方式

2018-06-22 07:36:37来源：未知阅读 ()

一、简单控件

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用于客户端，

未完待续！！！！！！！

标签：

版权申明：本站文章部分自网络，如有侵权，请联系：west999com@outlook.com
特别注意：本站所有转载文章言论不代表本站观点，本站所提供的摄影照片，插画，设计作品，如需使用，请与原作者联系，版权归原作者所有

上一篇：.NET WebForm 简介

下一篇：大话程序猿眼里的高并发架构

IDC资讯：主机资讯注册资讯托管资讯 vps资讯网站建设

网站运营：建站经验策划盈利搜索优化网站推广免费资源

网站联盟：联盟新闻联盟介绍联盟点评网赚技巧

行业资讯：搜索引擎网络游戏电子商务广告传媒

网络编程： Asp.Net编程 Asp编程 Php编程 Xml编程 Access Mssql Mysql 其它

服务器技术： Web服务器 Ftp服务器 Mail服务器 Dns服务器安全防护

软件技巧：其它软件 Word Excel Powerpoint Ghost Vista QQ空间 QQ FlashGet 迅雷

网页制作： FrontPages Dreamweaver Javascript css photoshop fireworks Flash

程序设计： Java技术 C/C++ VB delphi

网络知识：网络协议网络安全网络管理组网方案 Cisco技术

操作系统： Win2000 WinXP Win2003 Mac OS Linux FreeBSD

热门词条

最新资讯

热门关注

热门标签