ASP.NET-AJAX笔记总结
1第一个ASP.NET程序
概念：ASP.NET是建立在微软新一代.Net平台架构上，利用普通语言运行时（Common Language Runtime）在服务器后端为用户提供建立强大的企业级Web应用服务的编程框架。
优点：
与浏览器无关
方便设置端点、易于调试
编译后执行，运行效果提高
丰富的控件库
创建与项目文件同目录下的解决方案（适用于普通系统）
步骤：
文件——新建——项目——Visual Studio 解决方案（到此新建一个不包含项目的空解决方案）——在解决方案资源管理器中，选中新建的接解决方案——右键——
添加——新建网站——点击浏览，在打开的对话框中，选中刚才所建的空解决方案路径——在打开的对话框中选中，在现有的位置创建新网站——单击确定
创建与项目文件同目录下的解决方案（适用于构建三层结构的系统）
步骤：
文件——新建——项目——Visual Studio 解决方案（到此新建一个不包含项目的空解决方案）——在解决方案资源管理器中，选中新建的解决方案——
在解决方案路径后写入 /文件夹名——单击确定即可
| 弹框提示 |
|
| 种类 |
语法 |
| 新建空白页弹框 |
(1)Response.Write("<script>alert(/"用户名或密码错误！/");location.href='login.aspx';</script> "); |
| 在本页弹框(注册弹框) |
(1)Page.ClientScript.RegisterStartupScript(this.GetType(), "", |
//对显示的内容做处理(后置代码中)
public static string CutString(Object content, int num) {
if (content.ToString().Length > num - 2)
{
return content.ToString().Substring(0, num - 2) + "...";
}
else {
return content.ToString();
}
}
2系统对象与状态管理
Page对象
Page对象是指向页面自身的方式，在整个页面的执行期内，都可以使用该对象
示例：
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="defautl.aspx.cs" Inherits="_default" %>
| 属性 |
说明 |
| Language |
指定页面代码和后置代码使用的语言，需要注意的是，这里支持微软.NET框架中的语言 |
| AutoEventWireup |
设置页面是否自动调用网页事件（也就是在后置代码中的Page_Load() 事件是否执行），默认（不写时）为true |
| CodeFile |
指定代码后置文件，后置代码，该后置代码与页面是局部关系 |
| Inherits |
页面类 |
Request对象
Request对象封装了由Web浏览器或其他客户端生成的 HTTP 请求的细节（参数、属性和数据），提供从浏览器读取信息或这读取客户端信息等功能，用于页面请求期
Request对象是HttpRequest类的一个实例。它能够读取客户端在Web请求期间发送的HTTP值。
| Request对象属性 |
|
| 属性 |
说明 |
| UserLanguages |
客户端主机所使用的语言 |
| UserHostName |
客户端主机的DNS名称 |
| userHostArrress |
客户端主机的IP地址 |
| UserAgent |
客户端浏览器版本 |
| Url |
当前要求的URL |
| TotalBytes |
当前输入的容量大小 |
| ServerVariables |
网页的Server变量,集合中包含了服务器和客户端的系统信息 |
| RequestType |
客户端网页的传送方式(Get/Post) |
| RawUrl |
当前页面的URL |
| QueryString |
浏览器地址栏后的参数 |
| PhysicalPath |
当前网页在服务器端的实际路径 |
| PhysicalApplicationPath |
当前在服务器端执行的程序的实际路径 |
| Pathq |
当前网页的相对地址 |
| Params |
返回QueryString、Form、Cookies、ServerVariables的全部集合 |
| IsSecureConnection |
目前联机的安全性 |
| IsAuthenticated |
目前联机是否有效 |
| HttpMethod |
目前客户端网页的传送方式(Get/Post) |
| Headers |
网页的标题集合 |
| Form |
窗体变量 |
| Files |
客户端上传的文件 |
| FilePath |
当前执行网页的相对地址 |
| Cookies |
HttpCookieCollection对象集合 |
| ContentType |
当前需求的MIME内容类型 |
| ContentEncoding |
客户端浏览器的字符设置 |
| ConnectionlD |
客户端所提出的网页浏览请求的联机的ID |
| ClientCertificate |
客户端安全认证信息 |
| Browser |
客户端浏览器的信息(获取有关正在请求的客户端的浏览器功能的信息) |
| AnnlicationPath |
当前运行程序的服务器端虚拟目录 |
| Path |
获取当前请求的虚拟路径 |
| BinaryRead |
执行对当前输入流进行指定字节数的二进制读取 |
| MapPath |
为当前请求将请求的 URL 中的虚拟路径映射到服务器上的物理路径 |
示例：
1、使用QuestString获取 HTTP 查询字符串变量集合
页面1中有一连接地址进行参数传递：
<a href = "QueryString.aspx?nameA='asp'&nameB='jsp'">查看</a>
页面2获得地址参数：
//首次加载
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
if(Request.QueryString["nameA"] != null && Request.QueryString["nameB"] != null)
{
string nameA = Request.QueryString["nameA"] as string ;
string nameB = Request.QueryString["nameB"] as string ;
}
}
}
2、使用Form获取 HTTP 查询字符串变量集合
页面1中有一连接地址进行参数传递：
<form name="formGet" method="get" action = "Form.aspx?nameA='asp'&nameB='jsp'">
</form>
页面2获得地址参数：
//首次加载
<Script Language="C#" Runat="Server">
void Page_Load(object sender, System.EventArgs e)
{
Response.Write(Request.Form["nameA"] + "<br>" +Request.QueryString["nameB"]);
}
</Script>
Response对象
Response对象封装了返回到 HTTP 客户端的输出，提供向浏览器输出信息或者发送指令，用于页面执行期
| Response对象的常用方法 |
|||||||||||
| Write(String str) |
可以输出指定的文本内容 |
||||||||||
| End() |
可以使用 Web 服务器停止当前的程序并返回结果 |
||||||||||
| Rediect(String URL) |
可以将也页面重定向到另外一个页面 |
||||||||||
| Page对象在后置页面中的属性 |
|||||||||||
| 返回类型 |
语法 |
说明 |
示例 |
||||||||
| boolean |
IsPostBack |
获取一个值，该值指定该页是否正为响应客户端回发而加载，或者他是否正被首次加载或访问 (true 说明是响应客户端回发而加载 false 说明是首次加载或访问) |
if (!IsPostBack) { |
||||||||
| boolean |
IsCrossPagePostBack |
获取一个值，该值指示跨页回发中是否涉及该页（判断页面是否是跨页提交）( true 说明是跨页提交 false 说明不是跨页提交) |
if (Page.IsCrossPagePostBack) { |
||||||||
| PreviousPage 的属性和方法 |
|||||||||||
| 返回类型 |
语法 |
说明 |
示例 |
||||||||
| boolean |
IsCrossPagePostBack |
获取一个值，该值指示跨页回发中是否涉及该页（判断页面是否是跨页提交）(true 说明是跨页提交 false 说明不是跨页提交) |
if (PreviousPage.IsCrossPagePostBack) |
||||||||
| Control |
FindControl(String ID) |
在页命名容器中搜索带指定标识符的服务器控件。 |
((TextBox)this.PreviousPage.FindControl("txtKeyWord")).Text; |
||||||||
| ASP.NET页面传值 |
|||||||||||
| 页内传值 |
//传递 |
||||||||||
| 跨页传值 |
//接收数据 |
||||||||||
| 页面跳转 |
|||||||||||
| 重定向 |
Response.Redirect(String URL) |
protected void btnSub_Click(object sender, EventArgs e) |
|||||||||
| 使用Button自带的属性 |
PostBackUrl单击按钮时所发送到的 URL |
||||||||||
单击按钮页面跳转传参
//传参
protected void btnSub_Click(object sender, EventArgs e)
{
Response.Write("<script>window.location.href='BookDetail.aspx?iSBN="+this.txtISBN.Text+"'</script>");
//Response.Redirect("BookDetail.aspx?iSBN=" + this.txtISBN.Text);
}
//接受
protected void Page_Load(object sender, EventArgs e)
{
if (Request.QueryString["iSBN"] != null)
{
iSBN = Request.QueryString["iSBN"].Trim();
this.ShowBook(id, iSBN);
}
}
Cookie对象
保持于客户端的共享信息方式
| 单个写入形式 |
Response.Cookies["Cookie 的名称"].Value=变量值; //写入 Cookie |
| 使用数组类型形式 |
HttpCookie hcCookie = new HttpCookie("Cookie 的名称","值"); |
Session 对象
为某个用户提供共享信息，作用于用户会话期
语法
Session["Session 名称"] = 值; //存储
变量 = Session["Session 名称"] as 对象名; //读取
| Session对象的常用属性和方法 |
|
| 属性和方法 |
说明 |
| SessionID 属性 |
包含唯一的的用户会话标识符，它可用于在整个会话过程中记录用户信息 |
| Timeout 属性 |
用户设置用户超时的时间，单位为分钟。在该段时间内，用户即使没有任何操作，用户状态也不会被清除，注意此设置是针对服务器清除Session的时间而言，因为如果一段时间内没有操作，服务器是无法知道用户是否在线，所以一超时时间为限。而客户端有自己的处理机制，不同的浏览器也不尽相同，一般关闭窗口就会造成Session失效。(默认为20分钟) |
| IsNewSession 属性 |
如果已按当前请求创建会话，那么该属性将返回true |
| Clear 方法 |
从会话状态集合中移除所有的键和值 |
| Abandon方法 |
结束Session，取消当前会话(当前页面所有代码都执行结束以后才会执行) |
Application 对象
为所有用户提供共享信息，作用于整个应用程序运行期
语法
Application["Application 名称"] = 值;
变量 = Application["Application 名称"]
| Application 对象的常用属性 |
||
|
|
说明 |
|
| 属性 |
All |
返回全部的 Application 对象变量到一个对象数组 |
| AllKeys |
返回全部的 Application 对象变量到一个字符串数组 |
|
| Count |
取消 Application 对象变量的数值 |
|
| Item |
允许使用索引或 Application 变量名称传回内容值 |
|
| 方法 |
Add |
新增一个 Application 对象变量 |
|
|
|
|
| Clear |
清楚全部的 Application 对象变量 |
|
| Get |
使用索引值或变量名称传回变量值 |
|
| Set |
使用变量名称更新一个 Application 对象变量的内容 |
|
| Lock |
锁定全部的 Application 变量 |
|
| UnLock |
解除锁定 Application 变量 |
|
ViewState
Server对象
该对对象是 JSP中没有的，它提供了服务期端的一些属性和方法。
| Server对象的常用方法 |
|||||
| HtmlEncode |
此方法带有一个字符串参数，可以将其编码，使其在浏览器中正确显示。比如希望在页面输入一个"<br>"，又不想在浏览器中显示成换行，则需要使用该方法 |
||||
| HtmlDecode |
此方法与HtmlEncode方法相反，对以编码内容解码 |
||||
| MapPath |
此方法带有一个虚拟路径，可返回该路径的物理磁盘中的准去位置。此方法在Web开发过程中使用频率比较高。一般实现文件读写都需要该方法 |
||||
| UrlEncode |
对URL地址进行编码。对于URL需要传输含有"#"、"&"等特殊自负的参数时，需要进行编码，否则后面的内容不会被识别 |
||||
| Execute |
在当前页面执行参数指定的页面，执行完后继续执行本页面 |
||||
| Transfer |
参数指定的页面处理完成后，页面执行就结束，不像Execute那样还要返回控制权给先前的页面 |
||||
| Application,Session,Cookie,ViewState和Cache用法和区别 |
|||||
| 内置对象 |
信息量大小 |
作用域和保存时间 |
应用范围 |
保存位置 |
|
| Application |
任意大小 |
整个应用程序的生命期 |
整个应用程序/所有用户 |
服务器端 |
|
| Cache |
任意大小 |
可以根据需要设定 |
整个应用程序/所有用户 |
服务器端 |
|
| Session |
小量,简单的数据 |
用户活动时间+一段延迟时间(一般为20分钟) |
单个用户 |
服务器端 |
|
| Cookie |
小量,简单的数据 |
可以根据需要设定 |
单个用户 |
客户端 |
|
| Viewstate |
小量,简单的数据 |
一个Web页面的生命期 |
单个用户 |
客户端 |
|
| 隐藏域 |
小量,简单的数据 |
一个Web页面的生命期 |
单个用户 |
客户端 |
|
| 查询字符串 |
小量,简单的数据 |
直到下次页面跳转请求 |
单个用户 |
客户端 |
|
1.Application对象
Application用于保存所有用户的公共的数据信息,如果使用Application对象,一个需要考虑的问题是任何写操作都要在Application_OnStart事件(global.asax)中完成.尽管使用Application.Lock和Applicaiton.Unlock方法来避免写操作的同步,但是它串行化了对Application对象的请求,当网站访问量大的时候会产生严重的性能瓶颈.因此最好不要用此对象保存大的数据集合. 下面我们做个在线用户统计的例子来说明这个问题:
(以文件的形式存放网站总访问量)
Code
Global.asax类
using System;
using System.Collections;
using System.ComponentModel;
using System.Web;
using System.Web.SessionState;
using System.IO;
/// Global 的摘要说明。
public class Global : System.Web.HttpApplication
{/// 必需的设计器变量。
private System.ComponentModel.IContainer components = null;
private FileStream fileStream;
private StreamReader reader;//读字符流
private StreamWriter writer;//写字符流
public Global()
{
InitializeComponent();
}
protected void Application_Start(Object sender, EventArgs e)
{
Application["CurrentGuests"]=0;//初始花为０；
fileStream = File.Open(Server.MapPath("counts.text"),FileMode.OpenOrCreate);//文件不存在，创建文件
reader = new StreamReader(fileStream);//要读取的完整路径
Application["AllGuests"] = Convert.ToInt32(reader.ReadLine()); //从当前流中读取一行字符并将数据作为字符串返回
reader.Close();//关闭流
}
protected void Session_Start(Object sender, EventArgs e)//当用户访问网站时，在线用户+１，总访问数+１
{
Application.Lock();//同步,避免同时写入
Application["CurrentGuests"] =(int)Application["CurrentGuests"]+ 1;//总在线用户数
Application["AllGuests"] =(int)Application["AllGuests"]+ 1;//访问网站的总用户数
fileStream=new FileStream(Server.MapPath("counts.text"),FileMode.OpenOrCreate,FileAccess.ReadWrite);//
writer = new StreamWriter(fileStream);//实现一个写入流，使其以一种特定的编码向流中写入字符
writer.WriteLine(Application["AllGuests"].ToString());//把访问网站的总用户数再次写入到文件
writer.Close();//关闭写入流
Application.UnLock();//同步结束
}
protected void Session_End(Object sender, EventArgs e)//当前用户退出网站时,在线用户数量-1,
{
Application.Lock();
Application["CurrentGuests"] =(int)Application["CurrentGuests"] - 1;//总在线用户数量-1
Application.UnLock();
}
}
(2) WebForm1.aspx
private void Page_Load(object sender, System.EventArgs e)
{
this.Label1.Text = "正在访问站点的用户数：" + Application["CurrentGuests"].ToString();
this.Label2.Text ="访问过站点的总用户数：" + Application["AllGuests"].ToString();
}
2.Session对象
Session用于保存每个用户的专用信息.每个客户端用户访问时，服务器都为每个用户分配一个唯一的会话ID（Session ID) . 她的生存期是用户持续请求时间再加上一段时间(一般是20分钟左右).Session中的信息保存在Web服务器内容中,保存的数据量可大可小.当Session超时或被关闭时将自动释放保存的数据信息.由于用户停止使用应用程序后它仍然在内存中保持一段时间,因此使用Session对象使保存用户数据的方法效率很低.对于小量的数据,使用Session对象保存还是一个不错的选择.使用Session对象保存信息的代码如下:
//存放信息
Session["key"]="value"
//读取数据
string UserName=Session["key"].ToString();
3.Cookie对象
Cookie用于保存客户浏览器请求服务器页面的请求信息,程序员也可以用它存放非敏感性的用户信息，信息保存的时间可以根据需要设置.如果没有设置Cookie失效日期,它们仅保存到关闭浏览器程序为止.如果将Cookie对象的Expires属性设置为Minvalue,则表示Cookie永远不会过期.Cookie存储的数据量很受限制,大多数浏览器支持最大容量为4K,因此不要用来保存数据集及其他大量数据.由于并非所有的浏览器都支持Cookie,并且数据信息是以明文文本的形式保存在客户端的计算机中,因此最好不要保存敏感的,未加密的数据,否则会影响网站的安全性.使用Cookie对象保存的代码如下:
//存放信息
Response.Cookies["key"].Value="value";
//读取信息
string UserID=Response.Cookies["key"].Value;
4.ViewState对象
ViewState 常用于保存单个用户的状态信息，有效期等于页面的生存期。跟隐藏控件相似。viewstate是在本页面之内各函数间进行传值的 , 至于为什么要使用这种方法是因为在一个事件发生之后 , 页面可能会刷新 , 如果定义全局变量会被清零 , 所以要使用 viewstate. ViewState容器可以保持大量的数据，但是必须谨慎使用，因为过多使用会影响应用程序的性能。所有Web服务器控件都使用ViewState在页面回发期音保存自己的状态信息。如果某个控件不需要在回发期间保存状态信息,最好关闭该对象的ViewState，避免不必要的资源浪费。通过给@Page指令添加“EnableViewState=false”属性可以禁止整个页面的ViewState。使用ViewState对象保存信息的代码如下。
//存放信息
ViewState["key"]="value";
//读取信息
string NameID=ViewState["nameID"].ToString();
5.Cache对象
Cache对象用于在HTTP请求间保存页面或数据。该对象的使用可以极大地提高整个应用程序的效率。常用于将频繁访问的大量服务器资源存储在内存中，当用户发出相同的请求后服务器不再次处理而是将Cache中保存的信息返回给用户，节省了服务器处理请求的时间。其生存期依赖于该应用程序的生存期。当重新启动应用程序时，将重新创建其Cache对象的实例。使用Cache对象保存信息的代码如下。
//存放信息
Cache["nameID"]="0001";
//存放信息
Cache.Insert("nameID","0001"1);
//读取信息
string NameID=Cache["nameID"].ToString();
6.隐藏域
Hidden控件是属于HTML类型的服务器控件，使用此控件可以实现隐藏域的功能。其实此控件和其它服务器控件的使用没有太大区别，只是它不会在用户端的浏览器中显示，始终处于隐藏状态。但是每次页面提交的时候，此控件和其它服务器控件一同提交到服务器端，因此在服务器端可以使用Value属性获取或保存一些数据信息。使用Hidden控件保存信息的代码如下。
//存放信息
Hidden.Value="0001";
//获取信息
string NameID=Hidden.Value;
7.查询字符串
查询字符串的方式是将要传递的值连接在URL后面，然后通过Response.Redirect方法实现客户端的重定向。这种方式可以实现在两个页面之间传递信息。由于URL的长度有一定的限制，因此不能传递太大的信息，加外安全性也不是很好。
//传递信息如下。(问号后面格式 key1=value1&key2=value2)
Response.Redirect("List.aspx?nameID=0001&gradeID=002");
//执行上面的语句后在IE地址栏显示的URL的代码如下。
http://localhost/List.aspx?nameID=0001&grade=002
//当跳转到List.aspx后，可以通过以下代码获得所传递的信息。
string NameID.GradeID;
NameID=Request.Params["nameID"];
GradeID=Request.Params["gradeID"];
3用站点导航控件与母版页搭建页面框架
| Lable控件 |
||||
| 属性 |
说明 |
|||
| ID |
控件的唯一标识，所有服务器都有 |
|||
| Text |
显示文本(如果在此控件里加入HTML标签，服务器会解析) |
|||
| Visible |
布尔类型，设置控件是否可见。默认为true(呈现)。这是所有服务器控件共有的属性 |
|||
| ForeColor |
设置前景色，这是所有服务器控件共有的属性，Lable中就识所有显示文字的颜色 |
|||
| Button控件常用属性和事件 |
||||
| 属性或事件 |
说明 |
|||
| Text属性 |
按钮上显示的文字，虽然不是所有服务器共有的特征，但该属性的出现还是比较频繁的 |
|||
| PostBackUrl属性 |
这是按钮的特性，按钮可以将页面提交到另外一个页面，由该属性确定 |
|||
| CausesValidation属性 |
是否导致激发验证 |
|||
| Click事件 |
控件被单击并且CommandName未复制时激发该事件，它是按钮最常用的事件 |
|||
| TextBox 控件常用属性和事件 |
||||
| 属性或事件 |
说明 |
|||
| AutoPostBack属性 |
布尔值，指定是否自动回发到服务器。默认为false |
|||
| AutoCompleteType属性 |
自动完成类型，比如设置该类型为 E-mail，则显示浏览器中记录的自动完成的E-mail地址 |
|||
| TextMode属性 |
枚举类型，SingleLine为默认值，显示一行文字;Password内容显示为星号;MulitiLine是显示多行文本内容 |
|||
| Text属性 |
设置或者获取控件的文本内容 |
|||
| ReadOnly属性 |
指示该控件内容是否可编辑，默认为false |
|||
| Wrap属性 |
布尔值，指示多行文本中的文本是否可以换行，默认为true；如果设置为false，则会显示一个水平滚动条 |
|||
| TextChang事件 |
当文本发生变化且失去焦点时触发的事件。注意该事件需要配合 AutoPostBack使用，因为只有自动回发到服务器，文本改变的事件才会执行 |
|||
SiteMapPath控件(面包屑导航)
步骤：
1、添加SiteMapPath控件(导航)
2、新建站点地图
3、编写站点地图
<?xml version="1.0" encoding="utf-8" ?>
<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0" >
<siteMapNode url="" title="" description="">
<siteMapNode url="" title="" description="" />
<siteMapNode url="" title="" description="" />
</siteMapNode>
</siteMap>
| 节点描述 |
|
| sitMap |
根节点，一个站点地图只能有一个siteMap元素。 |
| sitMapNode |
对应于页面的节点，一个节点描述一个页面。 |
| title |
描述页面(这个页面头部的<title>标记没有任何联系，虽然他们的值可以相同) |
| url |
文件在解决方案中的位置。 |
| description |
说明性文本 |
编写注意事项：
站点地图根节点为<siteMap>元素，每个文件有且仅有一个根节点。
<siteMap>下一级有且仅有一个<siteMapNode>节点。
<siteMapNode>下面可以包含多个新的<siteMapNode>节点。
在站点地图中，同一个URL仅能出现一次。
4、根据站点地图创建其他页面
注意：站点地图中必须有当前页的URL，否则该站点导航控件将不会显示。
| SiteMapPath控件常用属性 |
|
| 属性 |
说明 |
| pathSeparator |
控制分隔符。可以通过编辑模板更改分隔符为任意样式，比如为图片 |
| parentLevelsDisplayed |
要显示的父节点的级数，用于控制导航显示的级数，如果导航过深，可能影响美观，则需要通过该属性控制级数，默认情况下，该值为-1，表示无限制。 |
TreeView导航控件
步骤
1、添加TreeView控件（导航）
2、绑定方式
| 绑定站点地图 |
1、新建站点地图 |
| 绑定XML |
1、新建XML文件 |
3、设置格式：在TreeView任务的选择自动套用格式——在自动套用格式对话框中选择需要的样式——单击确定
| TreeView数据绑定的常用属性 |
|
| TexField |
设置显示文字所绑定的字段或元素 |
| NavigateUrlField |
设置链接对应的字段或元素值 |
母版页
概念：是以“.master”作为后缀名的文件，它可以将页面上的公共元素整合在一起
优点：
1、有利于站点修改和维护，降低开发人员的工作强度。
2、提供高效的内容整合能力。
3、有利于实现页面布局。
4、提供一种便于利用的对象模型。
| 普通页面与母版页面的区别 |
||||
| 方面 |
普通页面 |
母版页面 |
||
| 声明 |
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="..." Inherite="..." %> |
<%@ Master Language="C#" AutoEventWireup="true" CodeFile="..." Inherite="..." %> |
||
| 扩展名 |
普通页面是.aspx |
母版页面是.master |
||
| ContentPlaceHolder控件 |
普通页不可以使用此控件 |
母版页可以有一个或多个ContentPlaceHolder控件(标准) |
||
| 将静态页面转换成母版页 |
||||
| 创建内容页 |
方法1、在新建Web 窗体时将右下角的选择母版页框勾上——单击添加——在弹出的选择母板页对话框中的项目文件夹中选择母版页——单击确定然后将静态页面复制到<asp:Content></asp:Content>内——最后删除<html><head><link><meta><body><form> 方法2、在母版页上右键单击——选择添加内容页——然后就可以在ContentPlaceHolder控件区添加内容 |
|||
| 将现有页改为内容页 |
在@Page 标记指定 MasterPageFile 位置——去除内容页的多余 html 标签——去除form标记——创建<asp:Content>标签，并放入对应的内容——指定相应的ContentPlaceHolderID |
|||
| 内容页代码含义 |
||||
| 代码 |
含义 |
|||
| MasterPageFile |
用于指定所使用的母版页的路径 |
|||
| Title |
用于设置内容页显示的标题 |
|||
| ContentPlaceHolderID |
用于控制该Content控件在页面中的位置，即指定所对应的母版页中ContentPlaceHoder控件的ID，如果指定的ID在母版页中步存在，将会发生错误 |
|||
5数据查询与展示GridView
GridView连接数据源
编码指定数据源
this.GridView1.DataSource = 返回值为集合的方法;
this.GridView1.DataBind();
以下为使用数据源控件
| 数据源控件 |
||||||
| 控件名 |
说明 |
|||||
| SqlDataSource |
用来从SQL Server、ODBC、Oracle等数据源中检索数据。通过连接字符串指定。 |
|||||
| AccessDataSource |
继承自SqlDataSource，专门用于从Access数据库中检索数据 |
|||||
| ObjectDataSource |
能够将来自业务逻辑层的数据对象与表示层中的数据绑定控件绑定，实现数据的显示、编辑等任务 |
|||||
| XmlDataSource |
用于检索和处理XML等分层数据。它可以从文件、URL或者也包含XML内容的字符串中加载XML数据 |
|||||
| SiteMapDataSource |
专门处理类似站点地图的XML数据。默认情况下，数据源好似以.sitemap为扩展名的XML文件 |
|||||
| 常见数据绑定控件 |
||||||
| 控件名称 |
说明 |
|||||
| GridView |
通过表格方式实现数据的展示，并集成编辑、分页、排序等功能。 |
|||||
| DetailsView |
显示单条记录的详细信息，并支持对记录的添加、删除、修改等。 |
|||||
| DropDownList |
下拉菜单控件 |
|||||
| 数据绑定控件绑定数据源语法 |
||||||
| BoundField |
用于显示普通文本，是默认的数据绑定列的类型，一般自动生成的列就是该类型 |
|||||
| GridView查询所有信息 |
||||||
| 属性或事件 |
说明 |
|||||
| SelectedItem 属性 |
设置获取下拉菜单的选中项，该属性的类型为System.Web.UI.WebControls.ListItem，所有列表控件（ListControl）中的项都是该类型。他常用的两个属性是Text和Value。Value用于设置获取项的值；Text用于设置获取显示文本 |
|||||
| SelectValue 属性 |
获取选择项的值，与SelectedItem.Value一致 |
|||||
| DataTextField 属性 |
获取或设置提供列表项文本内容的数据源的字段 |
|||||
| DataValueField 属性 |
获取设置提供列表项值内容的数据源的字段 |
|||||
| AutoPostBack 属性 |
当选中一个列表项时，DropDownList 控件状态是否回发到服务器。默认情况下时false |
|||||
| SelectIndexChanged 事件 |
当列表控件选定的内容改变并发回服务器时发生。该事件仅当 AutoPostBack 属性设置为true是有效 |
|||||
//手动绑定DropDownList
this.ddlType.DataSource = RoomTypeManager.GetAllRoomTypes();
this.ddlType.DataTextField = "TypeName";
this.ddlType.DataValueField = "TypeId";
ddlType.DataBind();
//向DropDownList添加第一项
ListItem list = new ListItem();
list.Text = "--选择--";
list.Value = "0";
ddlType.Items.Insert(0, list);
GridView 删除
步骤
1、先查询所有信息并显示在GridView中
2、在 ObjectDataSource 任务——单击配置数据源——单击下一步——在定义数据方法中选择DELETE(不用设置ID因为ID是由DataKeyNames设置的)——在选择方法下拉框中选择
所需要的代参方法——单击完成
3、在 GridView 属性中——DataKeyNames属性——单击——在数据字段集合编辑器中——在可用数据字段——选择ID——单击确定
4、在GridView 任务——将启用删除勾上
5、加删除页眉——在GridView 任务——单击编辑列——在选定字段中选定删除——在属性窗口中修改HeaderText属性——单击确定
GridView实现全选
步骤
1、在GridView 任务——选择添加新列——在添加字段的选择字段类型下拉框中选择TemplateField——并添加页眉文本——单击确定
2、在GridView 任务——单击编辑模板——在GridView 任务模板编辑模式的显示下拉框中选择刚才添加的新列——在HeaderTemplate中
添加一个HTML中的CheckBox并添加相应的文字描述——在ItemTemplate中添加标准中的CheckBox——在GridView 任务——单击结束模板编辑
3、在aspx源码中编写JavaScript脚本，如下：
<script type="text/javascript" language="javascript">
function GetAllCheckBox(CheckAll)
{
var items = document.getElementsByTagName("input");
for(var i=0;i<items.length;i++)
{
if(items[i].type == "checkbox")
{
items[i].checked = CheckAll.checked;
}
}
}
</script>
4、调用方法
<asp:TemplateField HeaderText="全选">
<HeaderTemplate>
<input id="cbAll" type="checkbox" onclick="GetAllCheckBox(this)"/>全选
</HeaderTemplate>
<ItemTemplate>
<asp:CheckBox ID="chkSelect" runat="server" />
</ItemTemplate>
</asp:TemplateField>
5、在后置代码中获得多选项的ID
for (int i = 0; i < this.GridView1.Rows.Count; i++) //this.GridView1.Rows.Count获得本页GridView控件上所有行数
{
//获得GridView每一行中的控件名为checkselect的控件，也就是说获得的是GridView每一行中的CheckBox控件
CheckBox cb = (GridView1.Rows[i].FindControl("checkselect")) as CheckBox;
if (cb.Checked == true) //判断是否选中
{
//获得选中行的第一列值（一般将第一列绑定为ID列）,这样就可以根据此处的Id进行删改了
Convert.ToInt32(GridView1.Rows[i].Cells[0].Text.ToString());
}
}
实现光棒
执行的事件是GridView的RowDataBound事件
protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{
e.Row.Attributes.Add("onmouseover", "currentcolor=this.style.backgroundColor;this.style.backgroundColor='#6699ff'");
e.Row.Attributes.Add("onmouseout", "this.style.backgroundColor=currentcolor");
}
}
//根据修改、删除做处理(后置代码中)
protected void GVRoomTypes_RowCommand(object sender, GridViewCommandEventArgs e)
{
string cmd = e.CommandName;
int typeId = Convert.ToInt32(e.CommandArgument);
if (cmd == "De") //删除
{
RoomTypeManager.DeleteRoomTypeByTypeId(typeId);
}
else if (cmd == "Ed") //修改
{
Page.Server.Transfer("EditRoomType.aspx?typeId=" + typeId);
}
}
GridView详细显示
步骤
1、在GridView 任务——选择添加新列——在添加字段的选择字段类型下拉框中选择TemplateField——并添加页眉文本——单击确定
2、在GridView 任务——单击编辑模板——在GridView 任务模板编辑模式的显示下拉框中选择刚才添加的新列——在ItemTemplate中添加标准中的LinkButton——修改其ID属性、Text属性并设置它的CommandArgument属性(与此按钮相关联的命令参数)和CommandName属性(与此按钮相关的命令)
源码修改
<asp:TemplateField HeaderText="详细">
<ItemTemplate>
<asp:LinkButton ID="lkbParticular" runat="server" CommandArgument='<%# Eval("Id") %>' CommandName="xiang">详细
</ItemTemplate>
</asp:TemplateField>
3、在后置代码中编写下列事件（行按钮触发事件）
protected void GridView1_RowCommand(object sender, GridViewCommandEventArgs e)
{
if (e.CommandName.Equals("参数")) //判断事件触发行中那个控件（有CommandName属性设置）
{
int id = Convert.ToInt32(e.CommandArgument); //获得事件触发行的ID
Response.Redirect("#.aspx?id=" + id); //重定向到其他页面
}
}
4、添加DetailsView控件——在DetailsView 任务——在选择数据源中选择新建数据源——在数据源配置向导的选择数据源类型中选择
对象——单击确定
5、在选择业务对象下拉框中选择需要的业务逻辑层方法——单击下一步——在定义数据方法中选择SELECT——在选择方法下拉框中选择
所需要的代参方法——单击下一步
6、在定义参数对话框中的参数源下拉框中选择QueryString——在QueryStringField文本框中添加所要获得参数（一般获得id）——在
DefaultValue文本框中可以给定默认值（也可以不写）——单击完成
7、美化显示——在DetailsView 任务——单击编辑字段——对字段进行编辑——单击确定
| DetailsView 控件的常用属性和事件 |
||
| 属性或事件 |
说明 |
|
| DefaultMode 属性 |
设置获取控件默认的状态（模式）。该属性为枚举值，分为 ReadOnly（显示）、Edit（修改）和Insert（添加） |
|
| DataKey 属性 |
数据主键 |
|
| DataKeyNames 属性 |
设置获取一个字符串，该字符串包含数据源中间的组合 |
|
| ItemInserting 事件 |
单击添加按钮，执行添加方法之前执行 |
|
| ItemInserted 事件 |
单击添加按钮，执行添加方法之后执行 |
|
| ItemUpdating 事件 |
单击更新按钮，执行更新方法之前执行 |
|
| ItemUpdated 事件 |
单击更新按钮，执行更新方法之后执行 |
|
| 数据绑定的写法Eval和Bind的对比 |
||
| Eval() |
Bind() |
|
| Eval是指读的，可实现格式化显示 |
Bind支持读/写功能，可将跟新后的数据提交回服务器。一般与TextBox等控件使用 |
|
在GredView设置方法
1、存储：在GridView的DataKeyNames属性设置ID
获得：在GridView的RowDataBound事件里 int ID = this.GridView1.DataKeys[e.Row.RowIndex].Value;
2、存储：在模板列的项目模板中添加控件设置控件的CommandArgument='<%# Eval("Id") %>'属性
获得：在GridView的RowCommand事件里int id = Convert.ToInt32(e.CommandArgument);
6数据插入与更新
验证控件
1、RequiredFieldValidator
功能：确保用户提供有效的输入，即提供非空验证。
| 属性 |
说明 |
| ControToValidate |
要验证的控件的ID，所有验证控件都有该属性 |
| Text |
出错时的提示，使所有验证控件共有的属性 |
| ErrorMessage |
提交给汇总的错误信息。另外，如果Text属性为空，则出错时将显示该信息，是所有验证控件共有的属性(只有Text显示完才会显示) |
示例：
<asp:TextBox ID="txtName" runat="server"></asp:TextBox>
<asp:RequiredFieldValidator ID="rfvName" runat="server" ControToValidate="txtName" ErrorMessage="请输入用户名"></asp:RequiredFieldValidator>
2、CompareValidator
功能：用于验证用户输入的内容是否符合要求
| CompareValidator控件的常用属性 |
|
| 属性 |
说明 |
| ControToValidate |
要验证的控件的ID，所有验证控件都有该属性 |
| ControlToCompare |
用来与要验证的控件进行比较的控件的ID |
| Type |
设置比较类型(比如字符串、整形等)，不同类型的比较可能会出错 |
| Operator |
设置比较运算符，比如等于、大雨等于、小于等于、大于、小于。默认设置为等于Equal |
| ValueToCompare |
用于比较的值 |
| Text |
出错时的提示，使所有验证控件共有的属性 |
| ErrorMessage |
提交给汇总的错误信息。另外，如果Text属性为空，则出错时将显示该信息，是所有验证控件共有的属性(只有Text显示完才会显示) |
示例：
<asp:TextBox ID="txtPassWord" runat="server" TextMode="PassWord" ></asp:TextBox>
<asp:TextBox ID="txtPassTwo" runat="server" TextMode="PassWord" ></asp:TextBox>
<asp:CompareValidator ID="cvPass" runat="server" ControlToCompare="txtPassWord" ControlToValidate="txtPassTwo" ErrorMessage="两次密码输入要一致"></asp:CompareValidator>
3、RangeValidator
功能：用于范围检查
| RangeValidator控件的常用属性 |
|
| 属性 |
说明 |
| ControToValidate |
要验证的控件的ID，所有验证控件都有该属性 |
| MaximumValue |
范围的上界(最大值) |
| MinimumValue |
范围的下界(最小值) |
| Type |
验证类型(字符串、整形、双精度、日期、货币五种)，不同类型之间比较可能引发问题 |
| Text |
出错时的提示，使所有验证控件共有的属性 |
| ErrorMessage |
提交给汇总的错误信息。另外，如果Text属性为空，则出错时将显示该信息，是所有验证控件共有的属性(只有Text显示完才会显示) |
4、RegularExpressionValidator
功能：是正则表达式的意思，正则表达式
| RegularExpressionValidator控件的常用属性 |
|
| 属性 |
说明 |
| ControToValidate |
要验证的控件的ID，所有验证控件都有该属性 |
| Text |
出错时的提示，使所有验证控件共有的属性 |
| ErrorMessage |
提交给汇总的错误信息。另外，如果Text属性为空，则出错时将显示该信息，是所有验证控件共有的属性(只有Text显示完才会显示) |
5、CustomachValidator
功能：用于自定义验证
| CustomachValidator控件的常用属性 |
|
| 属性 |
说明 |
| ControlToValidate |
要验证的控件的ID |
| ClentValidationFunction |
用于设置客户端验证的脚本函数 |
| OnServerValidate |
服务器端验证的事件方法 |
| Text |
出错时的提示，使所有验证控件共有的属性 |
| ErrorMessage |
提交给汇总的错误信息。另外，如果Text属性为空，则出错时将显示该信息，是所有验证控件共有的属性(只有Text显示完才会显示) |
6、ValidationSummary
功能：用于汇总所有的错误报告
| ValidationSummary控件的常用属性 |
|
| 属性 |
说明 |
| ShowMessageBox |
指示是否显示弹出的提示消息 |
| ShowSummary |
指示是否显示该报告内容，用于显示提示消息的时候 |
日期输入控件（日历控件和JS版日历）
Calendar日历控件
| Calendar控件的常用属性和事件 |
|
| 属性或事件 |
说明 |
| SelectedDate 属性 |
设置获取选择的日期 |
| VisibleDate 属性 |
当前可见的日期（默认显示的月份） |
| TitleFormat 属性 |
标题格式（“某月”或“某年某月”） |
| SelectionChanged 事件 |
选择某日期后的事件 |
步骤
JS版日历
My97DatePricker的使用
步骤
1、将My97DatePicker文件夹拷到网站的根目录下
2、编写应用代码
在页面增加如下
<script language="javascript" type="text/javascript" src="My97DatePicker/WdatePicker.js"></script>
(注意：填写相对路径，这里不可以使用"~"必须使用"..")
输入日期的文本框代码修改如下
<asp:TextBox ID="TextBox2" runat="server" CssClass="Wdate" onFocus="new WdatePicker(this,'%Y-%M-%D',true,'whyGreen')"></asp:TextBox>
(说明：this—表示返回日期的对象，'%Y-%M-%D'—自定义的日期格式，true—true表示带时间选择 ，whyGreen—皮肤的名称)
文件上传
1、添加FileUpload控件和Button控件
2、在Button的单击事件里编写如下代码
protected void Button1_Click(object sender, EventArgs e)
{
//获得上传文件的名称(包括扩展名)
string fileName = FileUpload1.FileName;
//获得上文件将要存放的路径(File为服务器端存放文件的文件夹名)
string strpath = Server.MapPath("File");
//文件上传(PostedFile——获取使用FileUpload控件上传文件的基础。SaveAs——保存上传文件的内容)
FileUpload1.PostedFile.SaveAs(strpath + "//" + fileName);
}
图片上传
1、添加FileUpload控件和Button控件
<asp:FileUpload onchange="CheckImg(this)" ID="FileUpload1" runat="server" />
//此脚本方法是用来验证扩展名的
function CheckImg(FileUpload)
{
//获得选中文件的路径
var mime = FileUpload.value;
//查找最后一个"."并从此处截取，然后将截取的部分转换成小写(也就是说截取的部分问文件的扩展名)
mime = mime.toLowerCase().substr(mime.lastIndexOf("."));
//对比扩展名做出相应的判断
if(mime!=".jpg")
{
FileUpload.value="";
alert("仅支持JPG格式");
}
}
2、在配置文件设置文件上传大小
<!--由maxRequestLength指定大小-->
<system.web>
<httpRuntime maxRequestLength="2048"/>
</system.web>
3、在Button的单击事件里编写如下代码
protected void Button1_Click(object sender, EventArgs e)
{
//获得上传文件的名称(包括扩展名)
string fileName = FileUpload1.FileName;
//获得上文件将要存放的路径(File为服务器端存放文件的文件夹名)
string strpath = Server.MapPath("File");
//获取上传文件的大小(单位为字节)
FileUpload1.PostedFile.ContentLength;
//文件上传(PostedFile——获取使用FileUpload控件上传文件的基础。SaveAs——保存上传文件的内容)
FileUpload1.PostedFile.SaveAs(strpath + "//" + fileName);
}
7数据查询与展示：DataList
DataList控件可用于创建模板化的列表数据，可以显示诸如一行中有多列的内容，可以用任何重复结构中的数据。
使用DataList控件显示数据
1、添加DataList控件（数据）——DataList任务——单击编辑模板——在项模板的ItemTempalte中添加Label控件——在Lable任务中——单击编辑DataBindings——在Lable DateBindings对话框中为Text绑定数据——首先选中字段绑定——在字段绑定下拉框中选择需要的字段——然后在选择自定义绑定进行代码表达式修改对要显示的外键字段对象进行修改来显示相应的属性——单击确定——单击结束模板编辑——在分隔符模板的SeparatorTemplate中添加分隔控件——结束模板编辑
2、数据绑定
(1)数据源控件绑定
在 ObjectDataSource 任务——单击配置数据源——单击下一步——在定义数据方法中选择Select选项中的方法——单击完成
(2)手动绑定数据(在后置代码中编写绑定方法,在首次加载页面时调用方法)
this.DataList1.DataSource = 调用业务逻辑层的数据访问方法();
this.DataList1.DataBind();
分页的实现
1、存储过程分页
SQL语句
Select Top pageSzie * from 表名 where 条件 and id not in (Select Top PageSize * (CurrentPageIndex-1) id from 表 where 条件 order by 排序条件) order by 排序条件
2、使用分页类分页
步骤
(1)编写数据查询方法(查询所有的方法)指定PagedDataSource实例对象的数据源
(2)分别设置允许分页、页大小、当前页的属性
(3)指定数据显示控件的数据源为该实例对象，并绑定
示例
using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using PracticeMyBookShopBLL;
public partial class datalistBook : System.Web.UI.Page
{
//分页属性
private int Pater
{
get{ return (int)ViewState["Page"]; }
set{ ViewState["Page"] = value; }
}
//首次加载
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
//首次加载时设置当前页
ViewState["Page"] = 1;
//首次加载时调用方法
Databind();
}
}
//分页数据绑定
private void Databind()
{
//创建分类
PagedDataSource pagedDataSource = new PagedDataSource();
//绑定数据
pagedDataSource.DataSource = BookManager.GetHotBook();
//设置是否自动分页功能
pagedDataSource.AllowPaging = true;
//设置每页记录数
pagedDataSource.PageSize = 5;
//设置当前页
pagedDataSource.CurrentPageIndex = Pater;
lblCurrentPage.Text = "第" + (pagedDataSource.CurrentPageIndex + 1).ToString() + "页共" + pagedDataSource.PageCount.ToString() + "页";
SetEnable(pagedDataSource);
this.DataList1.DataSource = pagedDataSource;
DataList1.DataBind();
}
//上一页
protected void btnPrev_Click(object sender, EventArgs e)
{
Pater--;
Databind();
}
//下一页
protected void btnNext_Click(object sender, EventArgs e)
{
Pater++;
Databind();
}
//根据条件设置是按钮否可用属性
private void SetEnable(PagedDataSource pagedDataSource) {
btnPrev.Enabled = true;
btnNext.Enabled = true;
if (pagedDataSource.IsFirstPage)
{
btnPrev.Enabled = false;
}
if (pagedDataSource.IsLastPage)
{
btnNext.Enabled = false;
}
}
}
| 分页类的属性 |
|
| 属性 |
说明 |
| CurrentPageIndex |
当前页 |
| PageCount |
总页数 |
| Count |
总记录数 |
| PageSize |
每页记录数 |
| DataSource |
数据源 |
| AllowPaging |
控件是否实现自动分页功能 |
8常用第三方控件
添加第三方控件
在工具箱任意一个选项卡中单击右键——再单击选择项——在选择工具箱项中的.NET Framework 组建中——单击浏览——在弹出的对话框中查找要添加的第三方控件——单击打开——最后单击确定
使用FreeTextBox在线编辑录入控件
1、添加FreeTextBox到标准工具箱——在页面中添加FreeTextBox控件即可
2、FreeTextBox控件常用属性
3、设置FreeTextBox控件Text属性实现绑定数据(必须使用Bind进行数据绑定，如果使用Eval将无法完成目录的更新)
例：
<FTB:FreeTextBox ID="FreeTextBox1" runat="server" Text='<%# Bind("Name")%>'></FTB:FreeTextBox>
4、错误处理
错误提示：从客户端中检测到有潜在危险的Request.From 值
错误原因：这是由于Asp.Net自身安全机制引起的，它屏蔽了有潜在危险的表单提交。
解决方法：在Page指令上设置ValidateRquest="false" 就可以了
使用验证码控件
1、添加SerialNumber控件到标准工具箱——在页面中添加SerialNumber控件
2、在后置代码中编辑验证代码
//首次加载处理
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack) {
this.SerialNumber1.Create(); //首次加载页面创建新验证码
}
}
//判断输入的验证码是否正确，并做出相应的显示
protected void Button1_Click(object sender, EventArgs e)
{
if (SerialNumber1.CheckSN(this.TextBox1.Text.Trim()))
{
this.Label1.Text = "<script>alert('正确！');</script>";
}
else {
SerialNumber1.Create();
}
}
| 常用属性和方法 |
||
| 返回类型 |
方法名 |
说明 |
| void |
Create() |
创建新验证码 |
| bool |
CheckSN(比较参数) |
验证输入的验证码是否正确 |
session 生成验证码
1、编写生成的验证码页面(GenerateSureCode.aspx)
using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using System.Drawing;
public partial class GenerateSureCode : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
this.GenImg(this.GenCode(4));
}
}
//产生随机字符串
private string GenCode(int num)
{
string[] source ={"0","1","2","3","4","5","6","7","8","9",
"A","B","C","D","E","F","G","H","I","J","K","L","M","N",
"O","P","Q","R","S","T","U","V","W","X","Y","Z","a","b","c","d","e","f","g","h","i","j","k","l","m","n","o","p","q","r","s","t","u","v","w","x","y","z"};
string code = "";
Random rd = new Random();
for (int i = 0; i < num; i++)
{
code += source[rd.Next(0, source.Length)];
}
return code;
}
//生成图片
private void GenImg(string code)
{
Bitmap myPalette = new Bitmap(60, 20);//定义一个画板
Graphics gh = Graphics.FromImage(myPalette);//在画板上定义绘图的实例
Rectangle rc = new Rectangle(0, 0, 60, 20);//定义一个矩形
gh.FillRectangle(new SolidBrush(Color.Yellow), rc);//填充矩形
gh.DrawString(code, new Font("宋体", 16), new SolidBrush(Color.Red), rc);//在矩形内画出字符串
myPalette.Save(Response.OutputStream, System.Drawing.Imaging.ImageFormat.Jpeg);//将图片显示出来
Session["ValidateCode"] = code;//将字符串保存到Session中，以便需要时进行验证
gh.Dispose();
myPalette.Dispose();
}
}
2、在页面中天加一个Image图片控件(通过ImageUrl属性来获得在GenerateSureCode.aspx页面生成的验证码)
<asp:Image ID="imgValidate" ImageUrl="~/GenerateSureCode.aspx" runat="server" />
3、在后置代码中编写如下代码
//此方法验证用户输入的验证码是否与生成的验证码一样
private bool CheckSN()
{
string validateCode = Session["ValidateCode"].ToString();//获得保存在Session中的验证码
if (this.txtValidate.Text != validateCode)
{
Response.Write("<script>alert('验证码输入错误，请重新输入！');</script>");
txtValidate.Text = "";
return false;
}
else
{
return true;
}
}
9用户控件和HttpHandler
| 用户控件 |
||
| 比较 |
用户控件 |
页面 |
| 后缀名 |
.ascx |
.aspx |
| 指令 |
@Control |
@Page |
| 继承 |
System.Web.UI.UserControl |
System.Web.UI.Page |
| 包含 |
可以包含控件和其他用户控件，也可以被其他的用户控件和页面包含 |
它可以包含控件和和所有用户控件，但是不可以被其他页面包含 |
| 直接访问 |
不可以，必须包含在页面中才能发挥作用 |
可以 |
| 标签 |
不可能包含<THML>,<Body>等HTML标签 |
可以包含所有HTML标签 |
| 编译和运行 |
可独立编译，但不能单独运行。不可以直接访问 |
可直接访问 |
水印的实现(指定Handler方式)
步骤
1、创建HttpHandler程序(PictureHandler.ashx)
<%@ WebHandler Language="C#" Class="PictureHandler" %>
using System;
using System.Web;
using System.Drawing;
using System.IO;
public class PictureHandler : IHttpHandler
{
//将要加水印文件路径
private const string PERSONPICTURE = "~/";
//水印文件路径
private const string WATERMARK_URL = "~/Image/watermark.jpg";
//默认图片路径
private const string DEFAULTIMAGE_URL = "~/Image/noperson.jpg";
public void ProcessRequest(HttpContext context)
{
//组合图片路径
string path = context.Request.MapPath(PERSONPICTURE + context.Request.Params["pictureName"].ToString());
//声明图片对象
System.Drawing.Image image;
//判断相应路径中的文件是否存在
if (File.Exists(path))
{
//加载文件
image = Image.FromFile(path);
//加载水印图片
Image watermark = Image.FromFile(context.Request.MapPath(WATERMARK_URL));
//实例化画布
Graphics g = Graphics.FromImage(image);
//在image上绘制水印
g.DrawImage(watermark, new Rectangle(image.Width - watermark.Width, image.Height - watermark.Height, watermark.Width, watermark.Height), 0, 0, watermark.Width, watermark.Height, GraphicsUnit.Pixel);
//释放画布
g.Dispose();
//释放水印图片
watermark.Dispose();
}
else
{
//加载默认图片
image = Image.FromFile(context.Request.MapPath(DEFAULTIMAGE_URL));
}
//设置输出类型为jpeg图片
context.Response.ContentType = "image/jpeg";
//将修改的图片存入输出流
image.Save(context.Response.OutputStream, System.Drawing.Imaging.ImageFormat.Jpeg);
//释放图片对象
image.Dispose();
context.Response.End();
}
public bool IsReusable
{
get
{
return false;
}
}
}
2、在后置代码中编写方法(AddWaterMark())
public string AddWaterMark(string path)
{
string imageUrl;
if (path != null)
imageUrl = "PictureHandler.ashx?pictureName=" + path;
else
imageUrl = "PictureHandler.ashx?pictureName=" + null;
return imageUrl;
}
3、在页面中调用方法(AddWaterMark())
<img src="<%=AddWaterMark("photo/1.JPG")%>" width="260" height="195" />
水印的实现(全局Handler方式)
1、修改配置文件——在<system.web>节点里添加如下代码
<httpHandlers>
<add verb="*" path="*.jpg" type="PictureHandler"/>
</httpHandlers>
说明：
verb：代表谓词(比如 GET、POST、FTP等)列表，又称动词列表。可以写作"GET、POST"。"*"为通配符，此处标识所有的请求。
path：访问路径，此处表示所有访问图片的访问路径的请求都将交给PictureHandler类进行处理。
"*"为通配符，由于该目录就是专门存放图片的目录，我们将所有访问该目录下的.jpg格式文件的请求都转交给PictureHandler类进行处理。
使用该配置后，不管请求的路径中有没有实际文件，都将执行该PictureHandler类。
type：指定逗号分隔的类/程序集组合。ASP.NET首先在应用程序的专用/Bin目录中搜索程序集DLL，然后在系统程序集缓存中搜索，这里指定的PictureHandler
就是将要编写的HttpHandler程序。
2、创建PictureHandler类(实现IHttpHandler的类默认情况下是存在App_Code目录下)
PictureHandler.cs
using System;
using System.Web;
using System.Drawing;
using System.IO;
public class PictureHandler : IHttpHandler
{
//水印文件路径
private const string WATERMARK_URL = "~/Image/watermark.jpg";
//默认图片路径
private const string DEFAULTIMAGE_URL = "~/Image/noperson.jpg";
public void ProcessRequest(HttpContext context)
{
//声明图片对象
System.Drawing.Image image;
//判断请求的物理路径中，是否存在文件(PhysicalPath 可用于获得 HTTP 请求所对应的物理路径)
if (File.Exists(context.Request.PhysicalPath))
{
//加载文件
image = Image.FromFile(context.Request.PhysicalPath);
//加载水印图片
Image watermark = Image.FromFile(context.Request.MapPath(WATERMARK_URL));
//实例化画布
Graphics g = Graphics.FromImage(image);
//在image上绘制水印
g.DrawImage(watermark, new Rectangle(image.Width - watermark.Width, image.Height - watermark.Height, watermark.Width, watermark.Height), 0, 0, watermark.Width, watermark.Height, GraphicsUnit.Pixel);
//释放画布
g.Dispose();
//释放水印图片
watermark.Dispose();
}
else
{
//加载默认图片
image = Image.FromFile(context.Request.MapPath(DEFAULTIMAGE_URL));
}
//设置输出类型为jpeg图片
context.Response.ContentType = "image/jpeg";
//将修改的图片存入输出流
image.Save(context.Response.OutputStream, System.Drawing.Imaging.ImageFormat.Jpeg);
//释放图片对象
image.Dispose();
context.Response.End();
}
public bool IsReusable
{
get
{
return false;
}
}
}
3、在页面中不用做任何修改
<img src="photo/1.JPG" width="260" height="195" />
实现.rar 压缩包的防盗链程序
1、修改配置文件——在<system.web>节点里添加如下代码
<httpHandlers>
<add verb="*" path="Download/*.rar" type="FileHandler" />
</httpHandlers>
2、创建FileHandler类(实现IHttpHandler的类默认情况下是存在App_Code目录下)
FileHandler.cs
using System;
using System.Data;
using System.Configuration;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
public class FileHandler:IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
//UrlReferrer：获取有关客户端上次请求的 URL 的信息，该请求连接到当前的URL
//Host：获取此实例的主机部分
//Port：获取此 URL 的端口号
if ((context.Request.UrlReferrer == null) || (context.Request.UrlReferrer.Host == "localhost" && context.Request.UrlReferrer.Port == 1259))
{
//Expires：获取或设置在浏览器上缓存的页过期之前的分钟数。如果用户在页面过期之前返回同一页面，则显示缓存的版本。
context.Response.Expires = 0;
context.Response.Clear();
//ContentType：获取或设置输出流的 HTTP MIME 类型
context.Response.ContentType = "rar";
context.Response.WriteFile(context.Request.PhysicalPath);
context.Response.End();
}
//如果不是本地引用，则属于盗链引用。
else
{
HttpResponse response = context.Response;
//ApplicationPath：获取服务器上 ASP.NET 应用程序的虚拟应用程序根路径
response.Redirect(context.Request.ApplicationPath + "/ErrorPage.htm");
}
}
public bool IsReusable
{
get
{
return false;
}
}
}
3、在页面中不用做任何修改
<a href="Download/Code1.rar">共享资源一</a>
缓存技术
一、页面缓存
整页缓存
概念：整页缓存是最简单的缓存形式，页是常用的缓存形式。它将整个页面进行缓存。
语法：
<%@ OutputCache Duration="60" VaryByParam="id" VaryByCustom="browser" %>
应用情况
不需要频繁更新数据的页面
占用大量时间和资源才能
| 整页缓存的主要属性 |
|
| Duration |
必需属性。页面应该被缓存的时间，以秒为单位。必须是正整数。 |
| Location |
指定应该对输出进行缓存的位置。 |
| VaryByParam |
该属性是以分号分隔的字符串变量，以其中每一个变量作为参数传递的页都将被作为缓存处理。"none"表示不随任何参数变化，"*" 根据所有参数变化 |
| VaryByControl |
该属性是以分号分隔的字符串变量，用来该变用户控件的输出缓存，这些字符串代表用户控件中声明的服务器控件ID |
| VaryByCustom |
用于自定义输出缓存要求，他允许在global.asax中指定自定义变动，如果该属性值是browser，则缓存将随浏览器名称和主要信息版本信息的不同而异 |
| VaryByHeader |
基于指定的标头中的变动改变缓存条目。 |
示例：
在页面代码的指令区添加如下代码
<%@ OutputCache Duration="60" VaryByParam="id" VaryByCustom="browser" %>
说明：VaryByParam属性的id只从上一个页面请求时的参数Response.Rediect("User.aspx?id="+id);
页面部分缓存(缓存后替换)
概念：所谓缓存后替换就是将整个页面缓存，然后替换页面中不需要缓存的部分
实现控件——Subsitutioin控件
1、添加整页缓存指令
<%@ OutputCache Duration="120" VaryByParam="none" %>
2、在不需要缓存的部分添加Subsitution控件
<asp:Subsitution ID="Subsitution1" runat="server" MethodName="GetNum" />
3、在后置代码中编写Subsitutioin控件的MethodName属性方法
protected static string GetNum(HttpContext context)
{
DataTable dt = GetTicketsDataTable(3);
return dt.Rows[0]["num"].ToString();
}
注意：
Subsitutioin控件 MethodName属性所调用的方法必需满足三个条件
(1)必需是静态(static)方法
(2)返回类型必需是string
(3)参数类型必需是HttpContext类型
二、数据缓存(应用程序缓存)
概念：应用程序缓存是用来存储与应用程序相关的对象，主要是由Cache类来实现的。
命名控件
using System.Web.Caching;
添加缓存
1、指定键和值
Cache["key"] = "value";
这种方法添加缓存最方便，但是如果需要设置缓存的有效期、依赖项等特性，它就变得无能为力了
2、使用Add()方法——只用于在ASP.NET缓存中添加新的缓存项(如果用它覆盖现有的缓存项，则会失败)。
Cache.Add("key","value",CacheDependency,DateTime,TimeSpan,CacheItemPriority,CacheItemRemovedCallbac);
这种方法适用于需要设置缓存的有效期、依赖项等特性的缓存，但是要注意它的7个参数必须写完整才能生效，所以灵活性不够好。
参数说明：
第一个参数：key——表示引用缓存对象的键(键)
第二个参数：value——表示要缓存的对象(值)
第三个参数：CacheDependency——表示添加依赖项(允许指定一个文件或缓存键。如果文件发生变化，对象就被删除。如果缓存键发生变化，对象也被删除)
第四个参数：DateTime——表示绝对过期时间(指明缓存数据过期的时间)
第五个参数：TimeSpan——表示可调过期时间又叫弹性的过期时间。指明缓存数据在上一次访问后可以在缓存中保留多长时间(也就是说在相对过期时间内，以相对过期时间剩余时间点为起点再进行相对过期时间。TimeSpan.Zero表示没有指定可调过期时间)()
第六个参数：CacheItemPriority——表示优先级，当在缓存被填满的时候删除那些优先级低的数据
第七个参数：CacheItemRemovedCallbac——表示回调自定义的方法(示例：可以在缓存项从缓存中删除时要求通知)，它的类型是CacheItemRemovedCallback类型的
示例一：(指定一个5分钟绝对过期时间)
//创建一个指定5分钟绝对过期时间的缓存
Cache.Add("key","value",null,DateTime.Now.AddMinutes(5),TimeSpan.Zero,CacheItemPriority.Normal,null);
示例二：(指定一个5分钟的弹性过期时间，没有指定绝对过期时间)
//创建一个指定5分钟弹性过期时间的缓存
Cache.Add("key","value",null,DateTime.MaxValue,TimeSpan.FromMinutes(5),CacheItemPriority.Normal,null);
示例三：(过期时间也取决于一个文件的修改)
//过期时间取决于test.xml文件修改。也就是说当test.xml文件内容修改时此缓存就会过期
CacheDependency dependency = new CacheDependency("C://test.xml");
//创建一个依赖文件修改而过期的缓存
Cache.Add("key","value",dependency,DateTime.MaxValue,TimeSpan.FromMinutes(5),CacheItemPriority.Normal,null);
示例四：(过期时间取决于缓存中另一项的修改)
//当缓存key1的值修改时，缓存key2就会过期
Cache.Add("key1","value",null,DateTime.MaxValue,TimeSpan.Zero,CacheItemPriority.Normal,null);
//添加爱到数组中
String[] dependencyKeys = new String[1];
dependencyKeys[0] = "key1";
CacheDependency dependency = new CacheDependency(null, dependencyKeys);
//创建一个依赖另一个缓存修改而过期的缓存
Cache.Add("key2","value",dependency,DateTime.MaxValue,TimeSpan.Zero,CacheItemPriority.Normal,null);
示例五：(缓存过期后回调方法)
//缓存过期将要调用的方法
public void ItemRemovedCallback(String key, Object value, CacheItemRemovedReason reason){}
//创建一个当指定5分钟的弹性过期时间后调用ItemRemovedCallback方法的缓存
Cache.Add("key","value",null,DateTime.MaxValue,TimeSpan.FromMinutes(5),CacheItemPriority.Normal,new CacheItemRemovedCallback(this.ItemRemovedCallback));
| 优先级值顺序 |
含义 |
| High |
设为此优先级的缓存项是最不可能在内存不足时被删除的 |
| AboveNormal |
设为此优先级的缓存项比优先级为Normal或以下的缓存项更优先保留 |
| Normal |
设为此优先级的缓存项比优先级为BelowNormal和Low的缓存项更优先保留 |
| BelowNormal |
这是倒数第二级的优先级；设为此优先级的缓存项只比优先级设为Low的缓存项更优先保留 |
| Low |
设为此优先级的缓存项是最有可能在内存不足时被删除的 |
| Default |
缓存项的优先级的默认值是Normal |
| NotRemovable |
当缓存项设为此优先级时，是在告诉ASP.NET即使是内存不足，也不要从缓存中删除它 |
3、使用Insert()方法——用于覆盖ASP.NET缓存中现有的缓存项。
这种方法可以实现多种方式的方法重载，使用起来比较灵活(但主要用法和Cache.Add用法差不错)
Cache.Insert("key","value");
示例一：(键值添加)
Cache.Insert("key1","value1");
示例二：(添加依赖项的缓存)
Cache.Insert("key","value",System.Web.Caching.CacheDependecy(null,dependencies));
示例三：(添加有效过期时间的)
Cache.Insert("key","value",DateTime.Now.AddMinutes(1d),System.Web.Caching.Cache.NoSlidingExpiration);
示例四：(添加优先级的缓存)
Cache.Insert("key","value",null,System.Web.Caching.Cache.NoSlidingExpiration,System.Web.Caching.Cache.NoSlidingExpiration,System.Web.Caching.CacheItemPriority.High,null);
4、检索缓存
if (Cache["key"] != null)
{
//处理语句
}
5、移除缓存
(1)自动移除
出现缓存已满、或过期、依赖项更改等情况时，缓存项就会自动移除
(2)显示移除
Cache.Remove("key");
三、禁止使用缓存
1、客户端取消
<html>
<head>
<meta http-equiv="Expires" CONTENT="0">
<meta http-equiv="Cache-Control" CONTENT="no-cache">
<meta http-equiv="Pragma" CONTENT="no-cache">
</head>
<body>
</body>
</html>
2、服务器具端取消
Response.Buffer = true;
Response.ExpiresAbsolute = DateTime.Now.AddDays(-1);
Response.Cache.SetExpires(DateTime.Now.AddDays(-1));
Response.Expires = 0;
Response.CacheControl = "no-cache";
Response.Cache.SetNoStore();
3、Global里面：
protected void Application_BeginRequest(Object sender,EventArgs e)
{
HttpContext.Current.Response.Cache.SetNoStore();
}
//禁止后退
<%@ OutPutCache Location="None"%>
说明：Global 申请全局变量，一般定义在模块中，不可在程序文件中定义
public 可以在模块中定义，也可在程序文件中定义。
4、页面基类：
public class PageBase : Page
{
public PageBase(){}
protected override OnLoad(EventArgs e )
{
Response.Cache.SetNoStore();
base.OnLoad();
}
}
5、最简单的办法 :在URL后面随机的加一些没用的参数(IE是用过URL来控制缓存的，这样就解决了)
示例：http://xxx/xxx/xxx.jsp?p=xxx
1使用AJAX扩展控件
| 常用扩展控件列表 |
|
| 控件名 |
说明 |
| AutoComplete |
根据用户输入的前几个字母或汉字给出相关提示 |
| Accrdion |
分组菜单折叠 |
| Calendar |
通过客户端方法完善了刷新、焦点获取、自动隐藏的日历控件，可自由绑定文本框一显示时间 |
| CollapsiblePanel |
折叠面板 |
| ModalPopup |
弹出模式窗口 |
| Tabs |
选项卡控件 |
| Rating |
分级控件 |
| FilteredTextBox |
具备文本框的过滤特性，控制用户输入值的范围 |
| DropShadow |
实现各种阴影 |
| CascadingDropDown |
级联下拉菜单 |
| DragPanel |
可自由拖拽的面板 |
| Slider |
以滑块的形式显示数据 |
AutoCompleteExtender——提示控件
功能：它可以用来实现智能提示功能，根据用户输入的前几个字母或汉字给出相应的提示。
| AutoCompleteExtender控件常用属性 |
|
| TargetControlID |
要实现自动完成功能的控件ID |
| ServicePath |
Web Service的路径 |
| SerivceMethod |
要使用的Web Service方法 |
| MinimumPrefixLength |
用户输入多少个字母才出现提示 |
| EnableCaching |
是否启用缓存 |
| CompletionSetCount |
提示数据的行数 |
1、先编写WebService方法
using System;
using System.Web;
using System.Collections;
using System.Web.Services;
using System.Web.Services.Protocols;
using WebChat.BLL;
/// <summary>
/// UserWebService 的摘要说明
/// </summary>
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.Web.Script.Services.ScriptService()]
public class UserWebService : System.Web.Services.WebService
{
public UserWebService()
{
//如果使用设计的组件，请取消注释以下行
//InitializeComponent();
}
[WebMethod]
public string[] GetUserByPreName(string prefixText, int count)
{
return UserManager.GetUserByPreName(prefixText,count);
}
}
注意：
(1)创建Web Service方法必须加上[System.Web.Script.Services.ScriptService()]特性，它是Web Service专门为AJAX订制的特性在调用Web Service时必须加上此特性
(2)要调用的Web Service方法的两个参数名和类型是固定的，返回类型必须是string[] 型
//业务逻辑层调用数据访问层的方法
public static string[] GetUserByPreName(string foreName, int count)
{
return UserService.GetUserByPreName(foreName,count);
}
//数据访问层的代码编写返回值为string[]数组
public static string[] GetUserByPreName(string foreName, int count)
{
IList<User> users = new List<User>();
List<string> results = new List<string>(count);
string sql = "select top "+count+" * from Users where name like '" + foreName + "%'";
users = GetUsersBySql(sql);
foreach (User item in users)
{
results.Add(item.Name);
}
return results.ToArray();
}
private static IList<User> GetUsersBySql(string safeSql)
{
List<User> list = new List<User>();
try
{
DataTable table = DBHelper.GetDataSet(safeSql);
foreach (DataRow row in table.Rows)
{
User user = new User();
user.Id = (int)row["Id"];
user.LoginId = (string)row["LoginId"];
user.LoginPwd = (string)row["LoginPwd"];
user.Name = (string)row["Name"];
user.Address = (string)row["Address"];
user.Phone = (string)row["Phone"];
user.Mail = (string)row["Mail"];
user.UserState = UserStateService.GetUserStateById((int)row["UserStateId"]); //FK
user.UserRole = UserRoleService.GetUserRoleById((int)row["UserRoleId"]); //FK
user.Gender = (int)row["Gender"];
list.Add(user);
}
return list;
}
catch (Exception e)
{
Console.WriteLine(e.Message);
return null;
}
}
2、在页面中添加一个TextBox控件ID为txtUserName——在添加AutoCompleteExtender控件——修改AutoCompleteExtender控件属性
<cc1:AutoCompleteExtender ID="AutoCompleteExtender1" runat="server" TargetControlID="txtUserName" ServicePath="UserWebService.asmx" SerivceMethod="GetUserByPreName" MinimumPrefixLength="1" EnableCaching="true" CompletionSetCount="10" >
</cc1:AutoCompleteExtender>
Accordion——菜单折叠效果控件
功能：用来做导航菜单和分组数据的展示
| Accrdion的主要属性和模板 |
|
| SelectedIndex |
表示默认选择的面板索引 |
| HeaderCssClass |
表示整个菜单的标题样式 |
| ContentCssClass |
表示菜单的内容样式 |
| AutoSize |
表示Accordion内容的显示方式，主要有None、Limit和Fill三种，其中None表示可以被无限地拉伸和收缩 |
| Panes |
Panes是Accordion控件的内容所在，它里面只能包括AccordionPane控件。可以有多个Pants和AccordionPane |
| HeaderTemplate |
Accordion的标题模板 |
| ContentTemplate |
Accordion的内容模板 |
Accordion的使用
实现静态效果
步骤：创建AJAX网站——添加Accordion控件——在Accordion的Pans下添加两个AccordionPane控件——然后在网页代码中修改每个AccordionPane的HeaderTemplate标题模板和ConentTemplate内容模板——还要给AccordionPane的HeaderCssClass标题样式和ContentCssClass内容样式动态生成Accordion菜单
步骤：创建AJAX网站——布局页面向网页中添加Accordion控件——实现动态添加
示例
1、在布局页面向网页中添加Accordion控件
2、编写样式：
<style type="text/css">
.headerBg
{
cursor:hand;
text-align:center;
width:160px;
height:21px;
color:#000000;
font-family:宋体;
font-size:10pt;
font-weight:bold;
background-image:url(../images/leftmenubg.gif);
line-height:21px;
}
.contentBg
{
width:160px;
text-align:center;
cursor:hand;
font-family:宋体;
font-size:9pt;
line-height:21px
}
</style>
3、编写控件代码：
<cc1:Accordion ID="Accordion1" runat="server" Height="360px" AutoSize="fill" HeaderCssClass="headerBg" ContentCssClass="contentBg">
</cc1:Accordion>
4、修改后置代码实现动态加载
//动态添加方法
protected void DisplayHotBooks()
{
//得到所有书的分类信息
IList<Category> hList = CategoryManager.GetAllCategories();
//循环将书的分类名添加到Accordion控件标题中
foreach(Category hItem in hList)
{
//实例化一个AccordionPane控件
AccordionPane ap = new AccordionPane();
//实例化一个标签控件用来显示分类名
Label lblCategoryMenu = new Label();
//指定Label的Text属性为分类名
lblCategoryMenu.Text = hItem.Name;
//将Label控件添加到AccordionPane的标题部分
ap.HeaderContainer.Controls.Add(lblCategoryMenu);
//根据图书类型获得所有图书
IList<Book> cList = BookManager.GetBooksByCategoryId(hItem.Id);
//循环将图书信息添加到AccordionPane控件内容中
foreach(Book cItem in cList)
{
//实例化一个HyperLink控件
HyperLink hlBookMenu = new HyperLink();
//指定HyperLink的text属性为图书标题
hlBookMenu.Text = cItem.Title + "<br>";
//知道连接属性为书详细页面
hlBookMenu.NavigatUrl = "BookDetail.aspx?bid="+hItem.Id;
//将HyperLink控件添加到AccordionPane的内容部分
ap.ContentContainer.Controls.Add(hlBookMenu);
}
this.Accordion1.Panes.Add(ap);
}
}
CollapsiblePanel——折叠显示或隐藏控件
功能：可以使用按钮、图片等控制实现折叠效果来实现无刷新显示或隐藏指定面板中的内容的控件
注意：做好使用图片来控制(使用图片可以实现无闪刷新)
| CollapsiblePanel的属性 |
|
| 属性 |
说明 |
| TargetControID |
被显示或隐藏的Panel的ID |
| CollapsedSize |
折叠后的尺寸 |
| ExpandedSize |
展开后的尺寸 |
| Collapsed |
默认Panel是否处于折叠状态 |
| ExpandControlID |
激发伸展效果的控件ID |
| CollapseControlID |
激发折叠效果的控件ID |
| AutoCollapse |
失去焦点时是否自动折叠 |
| AutoExpand |
失去焦点是是否自动展开 |
| ScrollContents |
Panel内是否显示滚动条 |
| CollapsedText |
折叠后显示的文本信息 |
| ExpandedText |
展开后显示的文本信息 |
| ImageControlID |
使用图片实现折叠和展示时图片的ID |
| ExpandedImage |
实现展开时使用的图片路径 |
| CollapsedImage |
实现折叠时使用的图片路径 |
| ExpandDirection |
展开方向，有水平和垂直两种 |
示例
1、创建AJAX网站
2、布局页面
<!--层1里边是panel,panel里边是Accordion-->
<div id="div1" style="float:left">
<asp:Panel ID="pnlHidden" runat="server" >
<cc1:Accordion ID="Accordion1" runat="server" HeaderCssClass="headerBg" ContentCssClass="contentBg">
</cc1:Accordion>
</asp:Panel>
</div>
<!--panel里边是层2和层3-->
<asp:Panel ID="pnlShow" runat="server">
<div id="div2" style="float:left; width:20px;height:37%;padding-top:110px;text-align:center">
<asp:Image ID="Image1" runat="server" ImageUrl="~/Images/toleft.gif" />
</div>
<div id="div3" style="float:left">
</div>
</asp:Panel>
3、向网页中添加CollapsiblePanel控件——编写控件代码
<cc1:CollapsiblePanelExtender ID="CollapsiblePanelExtender1" runat="server"
TargetControlID="pnlHidden"
CollapsedSize="0"
ExpandedSize="180"
Collapsed="false"
ExpandControlID="Image1"
CollapseControlID="Image1"
AutoCollapse="false"
AutoExpand="false"
ScrollContents="false"
CollapsedText="显示"
ExpandedText="隐藏"
ImageControlID="Image1"
ExpandedImage="../Images/toleft.gif"
CollapsedImage="../Images/toright.gif"
ExpandDirection="Horizontal">
</cc1:CollapsiblePanelExtender>
Rating——评分控件
功能：实现等级评分功能
| CurrenRating |
当前默认等级 |
| MaxRatings |
最大等级 |
| StarCssClass |
等级星的样式 |
| EmpteyStarCssClass |
未被选中的等级星的显示样式 |
| FilledStarCssClass |
选中的等级星的显示样式 |
| WaitingStartCssClass |
更改等级星选中状态时的显示样式 |
| OnChanged |
等级变化触发的事件 |
1、创建网页——添加Rating控件
2、编写样式
<style type="text/css">
.ratingStar{width:28px;height:28px;cursor:pointer;background-repeat:no-repeat;}
.filedRatingStar{background-image:url(images/filled.gif);}
.emptyRatingStar{background-image:url(images/empty.gif);}
.watingRatingStar{background-image:url(images/waiting.gif);}
</style>
3、编写控件代码
<cc1:Rating ID="Rating1" runat="server" CurrentRating="3" MaxRating="5" StarCssClass="ratingStar" FilledStarCssClass="filedRatingStar" EmptyStarCssClass="emptyRatingStar" WaitingStarCssClass="watingRatingStar" OnChanged="Rating1_Changed" >
</cc1:Rating>
4、编写后置代码中的星等级更改OnChanged事件
protected void Rating1_Changed(object sender, AjaxControlToolkit.RatingEventArgs e)
{
if (int.Parse(e.Value) > 2) {
//提示信息
}
//if (Rating1.CurrentRating > 2) {
//提示信息
//}
}
Calendar——日厉控件
功能：获得时间
解决了传统ASP.NET三个问题
1、不能实现日历控件和TextBox 的只能绑定
2、选定日期后无法自动隐藏
3、选定日期后需要刷新页面
| Calendar控件属性 |
|
| TargetControlID |
与日历邦定的TextBox控件的ID |
| Format |
日历显示的日期格式 |
| CssClass |
日历的样式 |
| PopupButtonID |
通过选择按钮弹出日期时的按钮的ID |
示例
1、设置页面添加Calendar控件和TextBox控件
2、编写页面控件代码
<div>
<cc1:CalendarExtender ID="CalendarExtender1" runat="server" CssClass="calendar" TargetControlID="TextBox1" PopupButtonID="Button1" Format="yyyy-MM-dd">
</cc1:CalendarExtender>
<asp:TextBox ID="TextBox1" runat="server">
<asp:Button ID="Button1" runat="server" Text="获取时间" />
</div>
ModalPopup——模式窗口控件
功能：用来显示模式弹出窗口
| ModalPopup控件属性 |
|||
| TargetControlID |
用来控制弹出窗口的控件ID |
||
| PopuControlID |
要弹出的控件ID |
||
| DropShadow |
弹出的控件是否有阴影效果 |
||
| OkControlID |
确定按钮的ID |
||
| CancelControlID |
确定按钮的ID |
||
| Drag |
是否允许拖拽 |
||
| PopupDragHandleControlID |
允许拖拽的控件ID |
||
| BackgroundCssClass |
弹出控件后其他部分的样式 |
||
| X |
水平坐标 |
||
| Y |
垂直坐标 |
||
| ModalPopup控件的常用方法 |
|||
| 方法 |
说明 |
||
| Show() |
在需要时用来控制模式窗口的显示效果 |
||
| Hide() |
在需要时用来控制模式窗口的隐藏效果 |
||
步骤：创建AJAX网站——添加一个Panel控件——添加一个隐藏文本域——最后添加ModalPopup控件
示例
//弹出的后背景的样式
<style type="text/css">
.otherBgCss{background-color:#cccccc;}
</style>
//页面代码布局
<asp:Panel ID="Panel1" runat="server" >
<asp:TextBox Id="txtLogin" runat="server"></asp:TextBox>
<asp:TextBox Id="txtPwd" runat="server"></asp:TextBox>
<input type="image" runat="server" id="btnOK" src="images/btnOK.jpg" />
<input type="image" runat="server" id="btnCancel" src="images/btnCancel.jpg" />
</asp:Panel>
<input id="hid" type="hidden" runat="server" />
<ccl:ModalPopupExtender ID="ModalPopupExtender1" runat="server" TargetControlID="hid" PopupControlID="Panel1" DropShadow="true" OkControlID="btnOK" CancelControlID="btnCancel" Drag="true" PopupDragHandleControlID="Panel1" BackgroundCssClass="otherBgCss">
</ccl:ModalPopupExtender>
//后置代码中调用
ModalPopupExtender1.Show();
Tabs——选项卡控件
功能：可以在一个页面上实现多个选项卡
| Tabs属性 |
|
| 属性 |
说明 |
| HeaderText |
表示选项卡的标题 |
| HeaderTemplate |
选项卡的标题模板 |
| ContentTemplate |
选项卡的内容模板 |
| ActiveTabIndex |
默认显示的选项卡索引(索引从0开始) |
步骤：创建AJAX网站——添加一个Tabs控件
<ccl:TabContainer ID="TabContainer1" runat="server" ActiveTabIndex="2">
<ccl:TabPanel ID="TabPanel1" runat="server" HeaderText="用户1">
</ccl:TabPanel>
<ccl:TabPanel ID="TabPanel2" runat="server" HeaderText="用户2">
</ccl:TabPanel>
<ccl:TabPanel ID="TabPanel3" runat="server" HeaderText="用户3">
</ccl:TabPanel>
</ccl:TabContainer>
2使用AJAX核心控件
核心组件
AJAX Extensions 是ASP.NET AJAX 框架的核心组件
AJAX Extensions 核心组件主要包括 ScripManager、UpdatePanel、UpdateProgress、Trimer、ScripMangaerProxy
注：使用AJAX控件必须创建AJAX网站
ScripManager——全局脚本控制器
它在每个AJAX程序中必须有，必须只有一个，并且在所有的其他AJAX控件之前使用
<asp:ScriptManager ID="ScriptManager1" runat="server" >
</asp:ScriptManager>
UpdatePanel——更新面板
实现页面无刷新效果
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
</asp:UpdatePanel>
| UpdatePanel控件的属性和元素 |
|
| UpdateMode属性 |
表示该更新面板采用何种方式来获取服务器端的资源 |
| UpdatePalte子元素 |
<ContentTemplate>—使用更新面板的内容模板，这和GridView等控件的模板类似，可以在其中添加任何控件。 |
UpdateProgress——等待界面
它用来在更新过程中给出提示，它可以起到类似于进度条的功能。(一般将此控件放在UpdatePanel中)
登录示例
1、在页面中添加UpdatePanel控件——在UpdatePanel控件里添加UpdateProgress控件(代码如下)
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<div id="div1" runat="server">
<div style="text-align:center; font-size:10pt">
<asp:UpdateProgress ID="UpdateProgress1" runat="server">
<ProgressTemplate>
正在加载,请稍后.....
</ProgressTemplate>
</asp:UpdateProgress>
用户名：<asp:TextBox ID="txt_LoginId" runat="server" CssClass="inputCss" Width="145px"></asp:TextBox></div>
<div style="text-align:center; font-size:10pt">密 码：<asp:TextBox ID="txt_LoginPwd" runat="server" CssClass="inputCss" Width="146px"></asp:TextBox></div>
<div style="height:20px; padding-top:9px">
<asp:ImageButton ID="imgBtnLogin" ImageUrl="images/login.jpg" runat="server" OnClick="imgBtnLogin_Click" />
<asp:ImageButton ID="imgBtnRegister" ImageUrl="images/register.jpg" runat="server" OnClick="imgBtnRegister_Click" />
</div>
</div>
<div id="div2" runat="server" style="display:none" >
<div style="font-weight:bold;color:red">欢迎进入新语聊天系统<a href="Login.aspx"><font color="red">离开</font></a></div>
<div style="font-size:10pt; color:red"><asp:Label ID="lblUserInfo" runat="server"></asp:Label></div>
<div style="height:20px; padding-top:9px">
<asp:ImageButton ID="imgBtnManage" ImageUrl="images/gomanage.jpg" runat="server" OnClick="imgBtnManage_Click" />
<asp:ImageButton ID="imgBtnChat" ImageUrl="images/gochat.jpg" runat="server" OnClick="imgBtnChat_Click" />
</div>
</div>
</ContentTemplate>
</asp:UpdatePanel>
2、后置代码实现的登录时的等待效果
using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using WebChat.BLL;
using WebChat.Models;
public partial class Login : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void imgBtnLogin_Click(object sender, ImageClickEventArgs e)
{
User user;
if (UserManager.Login(this.txt_LoginId.Text, this.txt_LoginPwd.Text, out user))
{
div1.Style.Add("display", "none");
System.Threading.Thread.Sleep(2000); //实现睡眠线程
div2.Style.Add("display", "block");
lblUserInfo.Text = "您好："+user.Name;
Session["CurrentUser"] = user;
if (user.LoginId == "admin")
{
imgBtnManage.Visible = true;
}
else
{
imgBtnManage.Visible = false;
}
}
else
{
//AJAX实现弹框
ScriptManager.RegisterStartupScript(this.imgBtnLogin, this.GetType(), "warning", "alert('用户名或密码不正确，请重新填写');", true);
//ScriptManager.RegisterStartupScript(this.UpdatePanel1, this.UpdatePanel1.GetType(), "", "alert('用户名或密码不正确，请重新填写');", true);
}
}
protected void imgBtnManage_Click(object sender, ImageClickEventArgs e)
{
Response.Redirect("SysManage/UserManage.aspx");
}
protected void imgBtnChat_Click(object sender, ImageClickEventArgs e)
{
Response.Redirect("Chat/ChatMain.aspx");
}
protected void imgBtnRegister_Click(object sender, ImageClickEventArgs e)
{
Response.Redirect("SysManage/Register.aspx");
}
}
Timer——定时控件
用于间隔一定的时间自动刷新页面或完成特定的任务
使用UpdatePanel控件和Timer控件实现定时无闪刷新
示例：
1、在页面中添加UpdatePanel控件——将要需要定时刷新的控件放在UpdatePanel控件里
2、添加Timer控件——设置Interval属性来控制Timer的时间间隔——并且指定Timer的OnTick事件实现数据绑定
示例：
//实现数据重新绑定
protected void Timer1_Tick(object sender, EventArgs e)
{
this.DataList1.DataSource = MessageManager.GetAllMessage(2);
this.DataList1.DataBind();
this.DataList2.DataSource = MessageManager.GetAllMessage(1);
this.DataList2.DataBind();
}
3、将UpdatePanel控件和Timer控件关联起来——单击Triggers属性——在弹出的