zoukankan      html  css  js  c++  java
  • 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-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用于客户端,

    未完待续!!!!!!!

  • 相关阅读:
    【xsy2479】counting 生成函数+多项式快速幂
    【 2019北京集训测试赛(十)】 子矩阵 二分
    【2019北京集训测试赛(七)】 操作 分治+FFT+生成函数
    Python 导出项目依赖/导出所有安装模块/打包数据
    数据结构与算法 介绍以及常见的算法排序
    爬虫 scrapy框架
    爬虫 开发者工具详解
    爬虫 selenium+Xpath 爬取动态js页面元素内容
    爬虫 解析库re,Beautifulsoup,
    爬虫 requests模块的其他用法 抽屉网线程池回调爬取+保存实例,gihub登陆实例
  • 原文地址:https://www.cnblogs.com/H2921306656/p/5889127.html
Copyright © 2011-2022 走看看