Coolite Toolkit学习笔记一：AjaxEvent、AjaxMethod和Listeners
本文共 3603 字，大约阅读时间需要 12 分钟。
一：AjaxEvent Coolite Toolkit所提供的AjaxEvent可以应用在很多的控件中，实现异步提交等相关功能。比如使用在Coolite Toolkit的Button控件中，通过该控件提供的机制就可以方便的使用。
如果需要使用在标准控件或是其他的html标签元素上，则需要通过Coolite Toolkit所提供的ScriptManager来实现了，下面简单演示将AjaxEvent使用在官方的Button控件上。
通过上面这种方式，可以把AjaxEvent添加到任何的html元素上（比如：input,div,p,span等等）。
二：AjaxMethod
Coolite Toolkit所提供的AjaxMethod功能和ASP.NET AJAX的PageMethod是一样的，使用非常简单，详细可参考下面的简单示例：
1 < script runat = " server " language = " C# " > 2 protected void OnAjaxEvent_Click( object sender, AjaxEventArgs e)
3 {
4 5 }
6 </ script > 7 < ext:Button ID = " Button1 " runat = " server " Text = " Submit " > 8 < AjaxEvents > 9 < Click OnEvent = " OnAjaxEvent_Click " ></ Click > 10 </ AjaxEvents > 11 </ ext:Button >
3 {
4 5 }
6 </ script > 7 < ext:Button ID = " Button1 " runat = " server " Text = " Submit " > 8 < AjaxEvents > 9 < Click OnEvent = " OnAjaxEvent_Click " ></ Click > 10 </ AjaxEvents > 11 </ ext:Button >
如果需要使用在标准控件或是其他的html标签元素上，则需要通过Coolite Toolkit所提供的ScriptManager来实现了，下面简单演示将AjaxEvent使用在官方的Button控件上。
< ext:ScriptManager ID = " ScriptManager1 " runat = " server " > < CustomAjaxEvents > < ext:AjaxEvent Target = " myButton " OnEvent = " OnAjaxEvent_Click " > < EventMask ShowMask = " true " MinDelay = " 500 " Msg = " 正在处理
" /> </ ext:AjaxEvent > </ CustomAjaxEvents > </ ext:ScriptManager > < script runat = " server " language = " C# " > protected void OnAjaxEvent_Click( object sender, AjaxEventArgs e)
{
}
</ script > < asp:Button ID = " myButton " runat = " server " Text = " 点我 " />
" /> </ ext:AjaxEvent > </ CustomAjaxEvents > </ ext:ScriptManager > < script runat = " server " language = " C# " > protected void OnAjaxEvent_Click( object sender, AjaxEventArgs e){
}
</ script > < asp:Button ID = " myButton " runat = " server " Text = " 点我 " />
通过上面这种方式，可以把AjaxEvent添加到任何的html元素上（比如：input,div,p,span等等）。
二：AjaxMethod
Coolite Toolkit所提供的AjaxMethod功能和ASP.NET AJAX的PageMethod是一样的，使用非常简单，详细可参考下面的简单示例：
[AjaxMethod]
public string PageMethod()
{
return " 调用了页面后置方法：PageMethod() " ;
}
public string PageMethod()
{
return " 调用了页面后置方法：PageMethod() " ;
}
< ext:ScriptManager ID ="ScriptManager1" runat ="server" > </ ext:ScriptManager > < ext:Button ID ="Button1" runat ="server" Text ="Submit" > < Listeners > < Click Handler ="RequestMethod()" /> </ Listeners > </ ext:Button > < script type ="text/javascript" > function RequestMethod() { Coolite.AjaxMethods.PageMethod({ success: function (result) { Ext.Msg.alert( ' 返回提示 ' , result); } }); } </ script >
通过Coolite Toolkit提供的Coolie.AjaxMethods.方法名直接调用后置方法。相互之间传递数据（简单文本串,对象,JSON）支持多种格式，这点和ASP.NET AJAX是一样的。除此之外，Coolite Toolkit还提供了更强大的页面方法调用功能，就是他可以调用母版页(MasterPage)和用户自定义控件(UserControl)里的方法。如果要调用母版页的方法，则需要在对应的母版页里提供AjaxMethod方法接口，并为其通过AjaxMethodProxyIDAttribute配置代理生成策略，如所示：
[AjaxMethodProxyID(IDMode = AjaxMethodProxyIDMode.None)]
public partial class MyMaster : System.Web.UI.MasterPage
{
[AjaxMethod]
public string PageMethod()
{
return " 调用了母版页的后置方法：PageMethod() " ;
}
}
public partial class MyMaster : System.Web.UI.MasterPage
{
[AjaxMethod]
public string PageMethod()
{
return " 调用了母版页的后置方法：PageMethod() " ;
}
}
前台页面调用：
<% @ Page Title = "" Language = " C# " MasterPageFile = " ~/MyMaster.Master " AutoEventWireup = " true " CodeBehind = " MasterDemo.aspx.cs " Inherits = " WebApplication1.MasterDemo " %> < asp:Content ID ="Content1" ContentPlaceHolderID ="ContentPlaceHolder1" runat ="server" > < ext:ScriptManager ID ="ScriptManager1" runat ="server" > </ ext:ScriptManager > < ext:Button ID ="Button1" runat ="server" Text ="Submit" > < Listeners > < Click Handler ="RequestMethod()" /> </ Listeners > </ ext:Button > < script type ="text/javascript" > function RequestMethod() {
Coolite.AjaxMethods.PageMethod({
success: function (result) {
Ext.Msg.alert( ' 返回提示 ' , result);
}
});
}
</ script > </ asp:Content >
Coolite.AjaxMethods.PageMethod({
success: function (result) {
Ext.Msg.alert( ' 返回提示 ' , result);
}
});
}
</ script > </ asp:Content >
如果是调用用户自定义控件里的方法，方式和母版页相差不大，不同的是UserControl需要设置别名才能成功调用。如下示例：
[AjaxMethodProxyID(IDMode = AjaxMethodProxyIDMode.Alias, Alias = " UC " )]
public partial class TimeControl : System.Web.UI.UserControl
{
[AjaxMethod]
public string PageMethod()
{
return DateTime.Now.ToString();
}
}
public partial class TimeControl : System.Web.UI.UserControl
{
[AjaxMethod]
public string PageMethod()
{
return DateTime.Now.ToString();
}
}
客户端使用别名调用如下：
<uc1:TimeControl ID="TimeControl1" runat="server" /> <ext:Button ID="btnUserControl" runat="server" Text="调用UserControl的方法"> <Listeners> <Click Handler ="Coolite.AjaxMethods.UC.PageMethod( { success:function(result) { Ext.Msg.alert(result); } });" /> </Listeners> </ext:Button>
三：Listeners Listeners在本文前面就用到过，通过Listeners给Ext按扭添加了一个客户端方法Handler，用得多的也就是他的Click事件，其他的我现在也还没用到，这里小记一下。以后用到了他的其他特性后在补充上来。
本文转自 beniao 51CTO博客，原文链接：http://blog.51cto.com/beniao/202202，如需转载请自行联系原作者
你可能感兴趣的文章
【模板】最小费用最大流
查看>>
五周第一次课（1月8日）
查看>>
解决vsftpd编译时的错误：could not read symbols: File in wrong format
查看>>
NHibernate学习总结
查看>>
html转译java语言
查看>>
oracle中时间转换的问题
查看>>
如何设计Android App测试用例
查看>>
sysbench
查看>>
详解MySQL读写分离
查看>>
dns服务器在做nslookup测试的时候,出现dns timeout 2 seconds的错误解释
查看>>
使用监控宝监控snmp性能经验实录
查看>>
開發Android, 從Eclipse官網下載Eclipse開始,從無到有安裝一遍
查看>>
逻辑判断
查看>>
mockcpp的so加载失败问题
查看>>
RHEL5下 JDK-7u4(rpm)+Tomcat-7.0+JavaCenterHome
查看>>
laravel 分页
查看>>
如何给在用的nginx添加新模块
查看>>
自然语言处理工具HanLP被收录中国大数据产业发展的创新技术新书《数据之翼》...
查看>>
单臂路由的配置
查看>>
jQuery相关面试题
查看>>