.net组件开发系列(二)之武林系列 太极拳 开发ajax控件.
2007-10-14 10:17
531 查看
.net组件开发系列(二)之武林系列 太极拳 开发ajax控件.
A.开篇:
在如今的web开发中,ajax以一个旧瓶新装的技术，以xml,javascript，XmlHttp为基础变新而来的。正如如今的太极拳，用得相当的广。太极拳是中国武苑中的奇葩异卉，是中华之瑰宝，经历数百年沧桑源远流长，逐渐演变成陈、杨、武、吴、孙、和等诸多流派。太极拳集技击、强体、医身、益智和修性为一体，蕴藏着东方哲学之神韵，正在为越来越多的所认识，而ajax也如太极一样，越来越多的开发人员去追逐。
我们都知道在.net 2.0中新增了ajax控件，但我们也想开发自已的ajax控件，我们先先看看编写ajax控件的知识吧。
开发ajax 控件不得不了解
A. ICallbackEventHandler 接口
该接口用于指示控件可以作为服务器的回调事件的目标。ICallbackEventHandler 接口的控件为目标时，将把事件变量作为参数传递来调用 RaiseCallbackEvent 方法以处理该事件，并且 GetCallbackResult 方法返回回调的结果。继承这个接口需要实现两个方法： RaiseCallbackEvent,GetCallbackResult.
>> RaiseCallbackEvent
用于处理客户端提交的请求。它接收一个string类型的参数，
格式：
protected void RaiseCallbackEvent(string eventArgument)
>>GetCallbackResult负责把服务器的处理结果返回到客户端
格式
protected void GetCallbackResult()
WebForm_DoCallback('__Page',arg,ReceiveServerData,context,null,false);
这段代码是什么意思呢？很显然的他调用了一个系统与定义的script函数：WebForm_DoCallback。我们要把这个函数找出来看看它具体 为我们干了什么。在运行时的页面源码中，我们很容易可以找到这段脚本的出处。我们注意到有一个
<script src="/ajaxTextDemo1/WebResource.axd?d=9QMEhP1JOTWr2B3RVTrtnA2&t=633255343980000000" type="text/javascript"></script>
就是调用下图的WebForm_DoCallbackpublic class TextChangedEventArgs : EventArgs
3.2我们定义的一些属性。如Text(string),ReturnString(string),IsValid(bool),ClientCallBackScript(string)
注意其中的两个属性：一个是IsValid,一个是ClientCallBackScript，那个IsValid是返回给客户端的值，又将它转成字符串给了ReturnString,因为下面这个方法中GetCallbackResult()
要求返回字符串。
IsValid的另一个重要作用在于，在客户端脚本中对于进行判定：例：
<script>
function GetCallbackData(res)
{ if(res=="True")
{
document.getElementById("Label1").innerHTML="<font color=blue>成功</font>";
document.getElementById("hi").value="1";
}
else
{
document.getElementById("Label1").innerHTML="<font color=blue>该用户已存在</font>";
document.getElementById("hi").value="0";
}
}
</script>
那个ClientCallBackScript属性，非常重要，它是指向哪个js将被调用，并由GetCallbackEventReference去调用。
如：
string callbackScript = Page.ClientScript.GetCallbackEventReference(this, "this.value", ClientCallBackScript, null);
页面中
<txt:ajaxText runat=server ID=aj ClientCallBackScript=GetCallbackData ...
指向正是上例中的function GetCallbackData(res)
3.3 Render方法
Render 方法将Web 控件发送到指定的HtmlTextWriter 实例。重写此方法以将自定义服务器控件发送到客户端
这个方法在后述中会讲到。
3。4 事件与委托。
定义了TextChanged事件，TextChangedEventHandler委托
1 public event TextChangedEventHandler TextChanged
2 {
3 add
4 {
5
6 Events.AddHandler(eventTextChanged, value);
7 }
8 remove
9 {
10
11 Events.RemoveHandler(eventTextChanged, value);
12 }
13 }
14
15
定义了一个TextChanged事件，而事件发生的时候只能用TextChangedHandler这个委托来做的。
把委托都存放在了一个EventHandlerList中，因此此处你可以看到add与remove,
这是访问器的声明，用于添加或移除客户代码中的事件处理程序，这样做的好处是公开大量的事件但不为每个事件分配字段，而是使用EventHandlerList存储这些事件例
关于事件与委托，事件与委托详见上篇
http://www.cnblogs.com/suiqirui19872005/archive/2007/10/12/922313.html
3.5 定义一个方法：
protected virtual void OnTextChanged(object sender, TextChangedEventArgs e)
{
TextChangedEventHandler handler = Events[eventTextChanged] as TextChangedEventHandler;
if (handler != null)
{
Text = e.TextValue;
handler(this, e);
}
}
当们重写这个方法时，将会激发TextChanged事件。并将事件处理类中的TextValue属性。附加上去。
3。6 实现ICallbackEventHandler接口
接口的两个方法。
public void RaiseCallbackEvent(string eventArgument)
{
TextChangedEventArgs args = new TextChangedEventArgs(eventArgument);
OnTextChanged(this, args);
}
public string GetCallbackResult()
{
return ReturnString;
}
3。7静态构造器
static ajaxText()
using System;
2using System.Data;
3using System.Configuration;
4using System.Web;
5using System.Web.Security;
6using System.Web.UI;
7using System.Web.UI.WebControls;
8using System.Web.UI.WebControls.WebParts;
9using System.Web.UI.HtmlControls;
10using System.ComponentModel;
11using System.Collections.Specialized;
12namespace cnblogs.suiqirui
17
197
5。示例代码:
aspx页面：
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<%@ Register Namespace="cnblogs.suiqirui" TagPrefix="txt" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>无标题页</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<input type=hidden id=hi runat="server" />
用户名:
<txt:ajaxText runat=server ID=aj ClientCallBackScript=GetCallbackData EnableViewState=true OnTextChanged="aj_TextChanged" /><asp:label runat=server ID="Label1" ></asp:label><br />
密码: <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<br />
<asp:Button ID="Button1" runat="server" Text=" 注册" OnClick="Button1_Click" Width="216px" /></div>
<script>
function GetCallbackData(res)
{ if(res=="True")
{
document.getElementById("Label1").innerHTML="<font color=blue>成功</font>";
document.getElementById("hi").value="1";
}
else
{
document.getElementById("Label1").innerHTML="<font color=blue>该用户已存在</font>";
document.getElementById("hi").value="0";
}
}
</script>
</form>
</body>
</html>
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 partial class _Default : System.Web.UI.Page
控件代码：见上
上述那个(4.0)
6.结语
终于完成了，休息一下了，呵呵，过两天，就出第三系列，如有不妥的地方，请大家更正。
7.前一系列:
马步功:http://www.cnblogs.com/suiqirui19872005/archive/2007/10/12/922313.html
示例代码:/Files/suiqirui19872005/ajaxTextDemo1.rar
A.开篇:
在如今的web开发中,ajax以一个旧瓶新装的技术，以xml,javascript，XmlHttp为基础变新而来的。正如如今的太极拳，用得相当的广。太极拳是中国武苑中的奇葩异卉，是中华之瑰宝，经历数百年沧桑源远流长，逐渐演变成陈、杨、武、吴、孙、和等诸多流派。太极拳集技击、强体、医身、益智和修性为一体，蕴藏着东方哲学之神韵，正在为越来越多的所认识，而ajax也如太极一样，越来越多的开发人员去追逐。
我们都知道在.net 2.0中新增了ajax控件，但我们也想开发自已的ajax控件，我们先先看看编写ajax控件的知识吧。
开发ajax 控件不得不了解
A. ICallbackEventHandler 接口
该接口用于指示控件可以作为服务器的回调事件的目标。ICallbackEventHandler 接口的控件为目标时，将把事件变量作为参数传递来调用 RaiseCallbackEvent 方法以处理该事件，并且 GetCallbackResult 方法返回回调的结果。继承这个接口需要实现两个方法： RaiseCallbackEvent,GetCallbackResult.
>> RaiseCallbackEvent
用于处理客户端提交的请求。它接收一个string类型的参数，
格式：
protected void RaiseCallbackEvent(string eventArgument)
>>GetCallbackResult负责把服务器的处理结果返回到客户端
格式
protected void GetCallbackResult()
WebForm_DoCallback('__Page',arg,ReceiveServerData,context,null,false);
这段代码是什么意思呢？很显然的他调用了一个系统与定义的script函数：WebForm_DoCallback。我们要把这个函数找出来看看它具体 为我们干了什么。在运行时的页面源码中，我们很容易可以找到这段脚本的出处。我们注意到有一个
<script src="/ajaxTextDemo1/WebResource.axd?d=9QMEhP1JOTWr2B3RVTrtnA2&t=633255343980000000" type="text/javascript"></script>
就是调用下图的WebForm_DoCallbackpublic class TextChangedEventArgs : EventArgs
3.2我们定义的一些属性。如Text(string),ReturnString(string),IsValid(bool),ClientCallBackScript(string)
注意其中的两个属性：一个是IsValid,一个是ClientCallBackScript，那个IsValid是返回给客户端的值，又将它转成字符串给了ReturnString,因为下面这个方法中GetCallbackResult()
要求返回字符串。
IsValid的另一个重要作用在于，在客户端脚本中对于进行判定：例：
<script>
function GetCallbackData(res)
{ if(res=="True")
{
document.getElementById("Label1").innerHTML="<font color=blue>成功</font>";
document.getElementById("hi").value="1";
}
else
{
document.getElementById("Label1").innerHTML="<font color=blue>该用户已存在</font>";
document.getElementById("hi").value="0";
}
}
</script>
那个ClientCallBackScript属性，非常重要，它是指向哪个js将被调用，并由GetCallbackEventReference去调用。
如：
string callbackScript = Page.ClientScript.GetCallbackEventReference(this, "this.value", ClientCallBackScript, null);
页面中
<txt:ajaxText runat=server ID=aj ClientCallBackScript=GetCallbackData ...
指向正是上例中的function GetCallbackData(res)
3.3 Render方法
Render 方法将Web 控件发送到指定的HtmlTextWriter 实例。重写此方法以将自定义服务器控件发送到客户端
这个方法在后述中会讲到。
3。4 事件与委托。
定义了TextChanged事件，TextChangedEventHandler委托
1 public event TextChangedEventHandler TextChanged
2 {
3 add
4 {
5
6 Events.AddHandler(eventTextChanged, value);
7 }
8 remove
9 {
10
11 Events.RemoveHandler(eventTextChanged, value);
12 }
13 }
14
15
定义了一个TextChanged事件，而事件发生的时候只能用TextChangedHandler这个委托来做的。
把委托都存放在了一个EventHandlerList中，因此此处你可以看到add与remove,
这是访问器的声明，用于添加或移除客户代码中的事件处理程序，这样做的好处是公开大量的事件但不为每个事件分配字段，而是使用EventHandlerList存储这些事件例
关于事件与委托，事件与委托详见上篇
http://www.cnblogs.com/suiqirui19872005/archive/2007/10/12/922313.html
3.5 定义一个方法：
protected virtual void OnTextChanged(object sender, TextChangedEventArgs e)
{
TextChangedEventHandler handler = Events[eventTextChanged] as TextChangedEventHandler;
if (handler != null)
{
Text = e.TextValue;
handler(this, e);
}
}
当们重写这个方法时，将会激发TextChanged事件。并将事件处理类中的TextValue属性。附加上去。
3。6 实现ICallbackEventHandler接口
接口的两个方法。
public void RaiseCallbackEvent(string eventArgument)
{
TextChangedEventArgs args = new TextChangedEventArgs(eventArgument);
OnTextChanged(this, args);
}
public string GetCallbackResult()
{
return ReturnString;
}
3。7静态构造器
static ajaxText()
using System;
2using System.Data;
3using System.Configuration;
4using System.Web;
5using System.Web.Security;
6using System.Web.UI;
7using System.Web.UI.WebControls;
8using System.Web.UI.WebControls.WebParts;
9using System.Web.UI.HtmlControls;
10using System.ComponentModel;
11using System.Collections.Specialized;
12namespace cnblogs.suiqirui
17
197
5。示例代码:
aspx页面：
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<%@ Register Namespace="cnblogs.suiqirui" TagPrefix="txt" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>无标题页</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<input type=hidden id=hi runat="server" />
用户名:
<txt:ajaxText runat=server ID=aj ClientCallBackScript=GetCallbackData EnableViewState=true OnTextChanged="aj_TextChanged" /><asp:label runat=server ID="Label1" ></asp:label><br />
密码: <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<br />
<asp:Button ID="Button1" runat="server" Text=" 注册" OnClick="Button1_Click" Width="216px" /></div>
<script>
function GetCallbackData(res)
{ if(res=="True")
{
document.getElementById("Label1").innerHTML="<font color=blue>成功</font>";
document.getElementById("hi").value="1";
}
else
{
document.getElementById("Label1").innerHTML="<font color=blue>该用户已存在</font>";
document.getElementById("hi").value="0";
}
}
</script>
</form>
</body>
</html>
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 partial class _Default : System.Web.UI.Page
控件代码：见上
上述那个(4.0)
6.结语
终于完成了，休息一下了，呵呵，过两天，就出第三系列，如有不妥的地方，请大家更正。
7.前一系列:
马步功:http://www.cnblogs.com/suiqirui19872005/archive/2007/10/12/922313.html
示例代码:/Files/suiqirui19872005/ajaxTextDemo1.rar
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 
相关文章推荐
- .net组件开发系列之武术系列 武术招数 控件生命周期与控件事件机制
- .Net组件开发介绍 开发ajax控件
- ★★★【庖丁解牛：纵向切入Asp.net 3.5控件和组件开发技术系列—(1)读者序】★★★
- ★★★【庖丁解牛：纵向切入Asp.net 3.5控件和组件开发技术系列—教程索引】★★★
- ★★★【庖丁解牛：纵向切入Asp.net 3.5控件和组件开发技术系列—(2)服务器控件开发中的调试技术】★★★
- 【Visual Studio风格开发系列 - PropertyGrid控件】C# 充分利用 .NET 框架的 PropertyGrid 控件
- 【React Native开发】React Native控件之Touchable*系列组件详解(18)
- ★★★【庖丁解牛：纵向切入Asp.net 3.5控件和组件开发技术系列—教程索引】★★★
- .net 大版下新增小论坛5214“组件/控件开发”
- .NET组件控件实例编程系列——1.开篇
- ★★★【庖丁解牛：纵向切入Asp.net 3.5控件和组件开发技术系列—(1)读者序】★★★
- 【React Native开发】React Native控件之Touchable*系列组件详解(18)
- .NET组件与控件开发
- .net知识系列之八：net中的ajax开发（javascript实现ajax，ajaxApro实现ajax，微软ajax库实现ajax）
- ★★★【庖丁解牛：纵向切入Asp.net 3.5控件和组件开发技术系列—(2)服务器控件开发中的调试技术】★★★
- 改变 PropertyGrid 控件的编辑风格（1）——加入日期控件-.NET教程,组件控件开发
- ADF_ADF Faces系列1_使用JSF开发基于Ajax的用户界面：ADF Faces 富客户端组件简介（Part1）
- ★★★【庖丁解牛：纵向切入Asp.net 3.5控件和组件开发技术系列—(3)从零开始开发服务器控件】★★★
- ★★★【庖丁解牛：纵向切入Asp.net 3.5控件和组件开发技术系列—(5)事件和数据回发机制】★★★
- ★★★【庖丁解牛：纵向切入Asp.net 3.5控件和组件开发技术系列—(6)页面状态机制(视图状态和控件状态)】★★★