日期:2014-05-16  浏览次数:20632 次

使用ICallbackEventHandler接口更高效实现Ajax

      使用ICallbackEventHandler接口可以方便地高效地实现Ajax功能

1、处理页面需实现ICallbackEventHandler接口,此接口有两个方法

      a、GetCallbackResult  此方法返回处理结果给客户端,请求完成后自动调用

      b、RaiseCallbackEvent此方法是从客户端获取数据 由参数eventArgument 接收,并进行相关处理得出结果

2、注册回调和主调脚本

      a、注册回调函数  string reference = Page.ClientScript.GetCallbackEventReference(this, "arg", "SendData", "context");

            注册一个对于回调函数的引用,用于获取返回结果,并进行业务逻辑处理,注册的函数名和客户端书写的函数名需相同才能引用

      b、注册主调函数,主调函数,像服务器发送请求 string regCallbakeScript = "function CallServer(arg,context){" + reference + "}";
            Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "CallServer", regCallbakeScript, true);

      c、客户端脚本:一个回调函数fucntion SendData(arg,context){alert(arg);}

           直接调用CallServer函数发送请求

 

    服务端代码
    /// <summary>
    /// 实现ICallbackEventHandler接口,完成Ajax更快的功能
    /// </summary>
    public partial class _Default : System.Web.UI.Page,ICallbackEventHandler
    {
        private string returnValue = string.Empty;
        protected void Page_Load(object sender, EventArgs e)
        {
            //注册回调脚本、具体实现自己写,此脚本中接收返回结果
            string reference = Page.ClientScript.GetCallbackEventReference(this, "arg", "SendData", "context");
            //注册处理脚本
            string regCallbakeScript = "function CallServer(arg,context){" + reference + "}";
            Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "CallServer", regCallbakeScript, true);
        }

        #region ICallbackEventHandler 成员

        /// <summary>
        /// 返回结果
        /// </summary>
        /// <returns></returns>
        public string GetCallbackResult()
        {
            if (string.IsNullOrEmpty(returnValue))
                return (returnValue = "-1");
            return returnValue;
        }

        /// <summary>
        /// 触发RaiseCallbackEvent事件获取客户端数据,然后进行处理
        /// </summary>
        /// <param name="eventArgument"></param>
        public void RaiseCallbackEvent(string eventArgument)
        {
            returnValue = eventArgument;
        }

        #endregion
    }

 

客户端脚本代码:
<script type="text/javascript">

    //接收回调结果,此函数在处理服务器完成后自动回调,即为回调函数,相当Ajax中的回调函数
    function SendData(arg) {
        alert(arg);
    }

    //客户端逻辑函数
    function GetReturnValue() {
        var arg = "Hello CallbackEventHandler!";
        //调用页面加载完成后注册的脚本,传递参数'arg'由服务器进行处理,第二个参数'context'不用传递
        CallServer(arg,"");
    }
</script>
<input type="button" value="CallbackMe" id="btn" onclick="GetReturnValue()" />