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("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用于客户端,
未完待续!!!!!!!
WebForm(二)——控件和数据库连接方式的更多相关文章
- Duilib源码分析(二)控件构造器—CDialogBuilder
上一节了解了大体流程,但是界面控件元素是如何被加载.解析.构建.管理.控件消息如何处理的呢?接下来我们将结合控件构造器进行分析: CDialogBuilder:控件构造器,主要用以解析xml配置文件并 ...
- Atitit.hybrid混合型应用 浏览器插件,控件的实现方式 浏览器运行本地程序的解决方案大的总结---提升用户体验and开发效率..
Atitit.hybrid混合型应用 浏览器插件,控件的实现方式 浏览器运行本地程序的解决方案大的总结---提升用户体验and开发效率.. 1. hybrid App 1 1.1. Hybrid Ap ...
- ASP.NET中 WebForm 窗体控件使用及总结【转】
原文链接:http://www.cnblogs.com/ylbtech/archive/2013/03/06/2944675.html ASP.NET中 WebForm 窗体控件使用及总结. 1.A, ...
- DevExpress XtraReports 入门六 控件以程序方式创建一个 交叉表 报表
原文:DevExpress XtraReports 入门六 控件以程序方式创建一个 交叉表 报表 本文只是为了帮助初次接触或是需要DevExpress XtraReports报表的人群使用的,为了帮助 ...
- C#-Xamarin的Android项目开发(二)——控件应用
相信我,这不是一篇吐槽文章.... 基础控件 Android的控件和控件样式非常特别,它是一种内联特别高的设计模式,换句话说,它是非常烂的设计.... 但在这种特别的关系里还是有一定的规律的,下面我们 ...
- 客户端的javascript改变了asp.net webform页面控件的值,后台代码中如何获取修改后的值。
客户端的javascript改变了asp.net webform页面控件的值,后台代码中如何获取修改后的值. 无论是什么的html控件,只要加上了runat="server" ...
- WPF 实现跑马灯效果的Label控件,数据绑定方式实现
原文:WPF 实现跑马灯效果的Label控件,数据绑定方式实现 项目中需要使用数据绑定的方式实现跑马灯效果的Label,故重构了Label控件:具体代码如下 using System; using S ...
- WebForm 常用控件
一.简单控件 1.Label(作用:显示文字) Web中: <asp:Label ID="Label1" runat="server" Text=&quo ...
- VS2017移动开发(C#、VB.NET)——Numeric控件的使用方式
Visual Studio 2017移动开发 控件介绍和使用方式:Numeric控件 Smobiler开发平台,.NET移动开发 一. 样式一 我们要实现上图中的效果,需要如下的操作 ...
随机推荐
- 开启了HA的XenServer如何关闭虚拟机?
可开启了HA很方便,在主机自己坏掉的情况下其中的虚拟机能自己飘到活的机器上并被运行起来,不过如果手动的需要关闭虚拟机的话在这情况下,该虚拟机会自己"复活"即便我们选的是关机. 此时 ...
- 记录一则ORA-12154,ORA-12560解决过程
应用服务器:Windows Server 2008 R2 Enterprise 故障现象:项目侧同事反映应用服务器上的程序连接数据库报错:ORA-12560: TNS: 协议适配器错误 1.故障重现 ...
- 【JVM】JVM系列之垃圾回收(二)
一.为什么需要垃圾回收 如果不进行垃圾回收,内存迟早都会被消耗空,因为我们在不断的分配内存空间而不进行回收.除非内存无限大,我们可以任性的分配而不回收,但是事实并非如此.所以,垃圾回收是必须的. 二. ...
- 用MVC做支付宝手机网页支付问题
支付宝支付接口手机网页支付 从官网扒下来的demo阿里做得还是相当不错的,只要参数改正确了基本上都是能跑通,WebForm的没什么大问题,这次要讲的主要是几个要注意的问题,因为是用MVC来做. 1.要 ...
- 谈谈JAVA工程狮面试中经常遇到的面试题目------什么是MVC设计模式
作为一名java工程狮,大家肯定经历过很多面试,但每次几乎都会被问到什么是MVC设计模式,你是怎么理解MVC的类似这样的一系列关于MVC的问题. [出现频率] [关键考点] MVC的含义 MVC的结构 ...
- Sql Server函数全解(五)之系统函数
系统信息包括当前使用的数据库名称,主机名,系统错误消息以及用户名称等内容.使用SQL SERVER中的系统函数可以在需要的时候获取这些信息.下面介绍系统函数的作用和使用方法. 1.返回表中指定字段的 ...
- 由面试引发的思考:B/S与C/S究竟是何物
一.现状说明: 就在这金三银四的求职黄金时期,我有幸作为公司的独立技术面试官,拥有最终决定录用权,在倍受上级领导的充分信任下,我也向上级保证,一定要为公司找到合适的人才,就在我满怀信心的情况下面试了一 ...
- JS验证图片格式和大小并预览
用于上传图片的js验证: <%@ page language="java" contentType="text/html; charset=UTF-8"p ...
- easyui combotree的使用
前台HTML: <div class="search-container"> <table class="search-container-table& ...
- 回溯法求n的全排列
代码如下: #include <iostream> #include <algorithm> #include <stdio.h> #include <cst ...