CooliteToolkit的AjaxEvent、AjaxMethod和Listeners的使用方法

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="button.aspx.cs" Inherits="Web_button_button" %>

<%@ Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" TagPrefix="ext" %>

<!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>

<script runat="server">
   protected void OnAjaxEvent_Click(object sender, AjaxEventArgs e)
    {
        Ext.Msg.Alert("Clicked", "AjaxEvent").Show();
    }

    [AjaxMethod]
    public string PageMethod()
    {
        return "调用了页面后置方法:PageMethod()";
    }

</script>


<script language=javascript>
    function RequestMethod() {
        Coolite.AjaxMethods.PageMethod({
            success: function(result) {
                Ext.Msg.alert('返回提示', result);
            }
        });
    }

    function changeText() {

        alert("");

    }

    function listenersEvent(but,e) {

        alert("点击对象:"+but.getId()+",this:"+this.getId());
   
    }
</script>
<body>
    <form id="form1" runat="server">
    <ext:ScriptManager ID="ScriptManager1"  runat="server">
      <%--<!--在标准控件或是其他的html标签元素上添加事件-->--%>
      <CustomAjaxEvents>
       <%--<!---clike触发后台事件--->--%>
       <ext:AjaxEvent OnEvent="OnAjaxEvent_Click" Target="myButton">
                <EventMask ShowMask="true" MinDelay="500" Msg="正在处理" />               
       </ext:AjaxEvent>
       <%--<!---Focus触发后台事件--->--%>
       <ext:AjaxEvent HtmlEvent=Focus Target="textBoxFocus" OnEvent="OnAjaxEvent_Click">
                <EventMask ShowMask="true" MinDelay="500" Msg="正在处理" />            
       </ext:AjaxEvent>
      </CustomAjaxEvents>
      <CustomListeners>
       <%--<!---触发前台clike事件--->--%>
       <ext:Listener Target="htmlButton"  Handler="RequestMethod()">          
       </ext:Listener>
       <%--<!---触发前台blur事件--->--%>
       <ext:Listener Target="textBoxBlur" Handler="RequestMethod()" HtmlEvent=Blur>          
       </ext:Listener>
      </CustomListeners>
    </ext:ScriptManager>
 
    <div>
   
        <ext:Button ID="Button1" runat="server" Text="AjaxMethods">
        <Listeners>
          <Click Handler="RequestMethod()" />
        </Listeners>
        </ext:Button>
       
        <ext:Button ID="Button2" runat="server" Text="AjaxEvent">
        <AjaxEvents>
          <Click  OnEvent="OnAjaxEvent_Click">
                <EventMask ShowMask="true" MinDelay="500" Msg="正在处理" />     
          </Click>
        </AjaxEvents>
        </ext:Button>
       
       
        <br />
       
       
        <!----绑定自定义事件指定this是Button2------>
        <ext:Button ID="Button4" runat="server" Text="注册事件">
         <Listeners>        
             <Click  Scope="Button2" Fn="listenersEvent" />
        </Listeners>
        </ext:Button>       
        <!----绑定自定义事件指定this是Button2------>
         <ext:Button ID="Button3" runat="server" Text="注册事件">
         <Listeners>        
             <Click  Scope="Ext.getCmp('Button2')" Fn="listenersEvent" />
        </Listeners>
        </ext:Button>
       
        <br />
       
        <asp:Button ID="myButton" runat="server" Text="clike触发后台事件" />
       
        <input id="htmlButton" type="button" value="触发前台clike事件" />
       
        <br />
        <br />
       
        <input id="textBoxBlur" type="text" value="触发前台blur事件" />
       
        <input id="textBoxFocus" type="text" value="Focus触发后台事件" />    

       
    </div>
    </form>
</body>
</html>


我发现要想灵活运用CooliteToolkit的提供的编程方法,也就是有时候不得不“javaScript”代码和“html”语言混在一起写,得对 JavaScript 和 Extjs 框架非常熟悉才行。不然很容易出现“javaScript” 错误,不但不会出现错误提示,而且界面不能正常显示,没有一定的功底,代码多的时候纠正错误真是困难啊! 如果对Extjs 框架非常熟悉,这个东西不用也罢了哈!个人感觉还是原始的好哈!混在一起写还是有点别扭的!而且好象又跑到了asp时代,代码和界面混在又混在一起了哈!

                                                                                                                                                 个人意见!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值