一、简单控件

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

未完待续!!!!!!!

WebForm(二)——控件和数据库连接方式的更多相关文章

  1. Duilib源码分析(二)控件构造器—CDialogBuilder

    上一节了解了大体流程,但是界面控件元素是如何被加载.解析.构建.管理.控件消息如何处理的呢?接下来我们将结合控件构造器进行分析: CDialogBuilder:控件构造器,主要用以解析xml配置文件并 ...

  2. Atitit.hybrid混合型应用 浏览器插件,控件的实现方式 浏览器运行本地程序的解决方案大的总结---提升用户体验and开发效率..

    Atitit.hybrid混合型应用 浏览器插件,控件的实现方式 浏览器运行本地程序的解决方案大的总结---提升用户体验and开发效率.. 1. hybrid App 1 1.1. Hybrid Ap ...

  3. ASP.NET中 WebForm 窗体控件使用及总结【转】

    原文链接:http://www.cnblogs.com/ylbtech/archive/2013/03/06/2944675.html ASP.NET中 WebForm 窗体控件使用及总结. 1.A, ...

  4. DevExpress XtraReports 入门六 控件以程序方式创建一个 交叉表 报表

    原文:DevExpress XtraReports 入门六 控件以程序方式创建一个 交叉表 报表 本文只是为了帮助初次接触或是需要DevExpress XtraReports报表的人群使用的,为了帮助 ...

  5. C#-Xamarin的Android项目开发(二)——控件应用

    相信我,这不是一篇吐槽文章.... 基础控件 Android的控件和控件样式非常特别,它是一种内联特别高的设计模式,换句话说,它是非常烂的设计.... 但在这种特别的关系里还是有一定的规律的,下面我们 ...

  6. 客户端的javascript改变了asp.net webform页面控件的值,后台代码中如何获取修改后的值。

    客户端的javascript改变了asp.net webform页面控件的值,后台代码中如何获取修改后的值.     无论是什么的html控件,只要加上了runat="server" ...

  7. WPF 实现跑马灯效果的Label控件,数据绑定方式实现

    原文:WPF 实现跑马灯效果的Label控件,数据绑定方式实现 项目中需要使用数据绑定的方式实现跑马灯效果的Label,故重构了Label控件:具体代码如下 using System; using S ...

  8. WebForm 常用控件

    一.简单控件 1.Label(作用:显示文字) Web中: <asp:Label ID="Label1" runat="server" Text=&quo ...

  9. VS2017移动开发(C#、VB.NET)——Numeric控件的使用方式

    Visual Studio 2017移动开发 控件介绍和使用方式:Numeric控件 Smobiler开发平台,.NET移动开发 一.          样式一 我们要实现上图中的效果,需要如下的操作 ...

随机推荐

  1. 韩顺平_linux_随堂笔记

    这还是自己3年前(2011年)整理的笔记,记得当时那会儿自己对Linux还特别的憧憬,也很喜欢韩老师的讲课风格,边看边做笔记乐此不彼,现在开通了技术博客,所以把当年的笔记也放上来和大家分享.同时推荐没 ...

  2. 用纯JS做俄罗斯方块 - 简要思路介绍(1)

    大家都知道俄罗斯方块是一款大众化的游戏了,我很小的时候就玩过,今年已经25岁了,可以说俄罗斯方块确实是历史悠久,做俄罗斯方块是我上个星期开始的想法.也许是由于自己从来没有写过这种东西吧,所以有生疏.代 ...

  3. SQLServer学习笔记系列12

    一.写在前面的话 这个sql学习系列,今天准备告一段落,虽然短短的十几篇文章,深刻感受到将学习的东西记录下来,是需要一种坚持! 这些东西只有反复的学习吸收,最终沉淀下来的才是属于自己的知识.也是提醒自 ...

  4. “全能”选手—Django 1.10文档中文版Part2

    第一部分传送门 第三部分传送门 第四部分传送门 3.2 模型和数据库Models and databases 3.2.2 查询操作making queries 3.3.8 会话sessions 目录 ...

  5. Web API与文件操作

    前段时间,一直有练习ASP.NET MVC与Web API交互,接下来,Insus.NET再做一些相关的练习,Web API与文件操作,如POST文件至Web API,更新或是删除等. 不管怎样,先在 ...

  6. C++控制台贪吃蛇代码

    游戏截图: 以下是3个代码文件: Snake_Class.h文件: #ifndef SNAKE #define SNAKE #include<windows.h> #include< ...

  7. 原生JS投票特效

    效果:http://hovertree.com/texiao/js/24/ 效果图: 代码如下: <!DOCTYPE html> <html lang="en"& ...

  8. 渡轮问题Ship

    题目描述 Palmia河从东往西流过Palmia国,把整个国家分成南北两半.河的两岸各有N个城市,北岸的每一个城市都与南岸的一个城市互为友好城市,而且任意两个北岸城市的友好城市都不相同.每一对友好城市 ...

  9. RequireJS+JQueryMobile

    RequireJS提供了JS下模块化开发的充分条件.之前我自己也在多个项目中尝试模块化开发,但是由于没有类似RequireJS这样的框架,最后的效果都不是很理想. 在RequireJS中,所有的JS都 ...

  10. AntiModerate – 渐进式图片加载的 JavaScript 库

    AntiModerate 是一个渐进式图片加载的 JavaScript 库.我们多数看到的图片显示模式,都是从上到下逐渐显示的,这是“标准式”图像:而有的图片是先出现一个很低分辨率的图像轮廓,类似加了 ...