ASP.NET的ICallbackEventHandler

    今天在cnblogs中看到一篇描写 ICallbackEventHandler 的文章 ----->此类是.net2.0出的一套实现无刷新的接口

    这让我想起几个月前作的一个项目中有次对此方法实现无刷新的使用,这里提到的是我无意中发现的一个非常有意思的对该 接口实现效果上的一个限制;

    对于.net是如何 实例化继承  ICallbackEventHandler  的类,到如何注册详细的JS脚本块与.net 服务器方法通信的 底层就不研究了,例子很多,这里讲一下案例了。

    是这样的 :

       1. 首先我在 页面应用 ICallbackEventHandler    的关联代码片段,结合业务需要,代码片段如下:

              注: DDL_MoldVersion为实现级联前触发的 DropDownList  . InsertItemBox 为进行级联最终的 ListBox 对象;

             (一).CS

 

 1 String cbReference = Page.ClientScript.GetCallbackEventReference(this"arg""ReceiveServerData""context");

        2 String callbackScript = "function CallServer(arg, context)" + "" + cbReference + ";}";
3 Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "CallServer", callbackScript, true);
4 DDL_MoldVersion.Attributes.Add("onChange""selectChangeDropDownList()");

             (二).CS

             

 2         #region ICallbackEventHandler 成员
 3         string returnValue;
 4         public string GetCallbackResult()
 5         {
 6             return returnValue;
 7         }
 8 
 9         public void RaiseCallbackEvent(string eventArgument)
10         {
11            
12             DataSet ds = bll.GetList("MoldVersion_ID='" + eventArgument + "'");
13 
14             DataTable dt = ds.Tables[0];
15             if (dt.Rows.Count > 0)
16             {
17                  
18                //  returnValue  = doing.. 
19             }
20             else
21             {
22                 returnValue  = doing.. 
23             }
24 
25             //returnValue = "1,2,3,4,5";
26         }
27 
28        
29 
30         #endregion 

 

              (三).aspx 1     <script type="text/ecmascript">

 2         function selectChangeDropDownList() {
 3 
 4             var drop = document.getElementById("<%=DDL_MoldVersion.ClientID %>");
 5             var select = drop.options[drop.selectedIndex].value;
 6             CallServer(select, "");
 7         }
 8 
 9 
10         function ReceiveServerData(rValue) {
11 
12             var listbox = document.getElementById("<%=InsertItemBox.ClientID %>");
13             var list = rValue.split('|');
14             for (var i = 0; i < list.length; i++) {
15                 var name = list[i].split(',')[0];
16                 var id = list[i].split(',')[1];
17                 listbox.options[i] = new Option(name, id);
18             }
19 
20         }
21       </script>

    

       2 测试运行,理论上讲或者绝对的说无刷新级联肯定能出来,但是就是没出来,一上 代码片段没问题。那问题处在哪呢?

          我这个页面上用到了一个 FredCK.FCKeditorV2 ,嘿嘿,就是这个东西导致的原因,不难推想  FredCK.FCKeditorV2在 跑起来的同时是

          需要一系列的核心JS 代码给运行起来的,所以我猜测是因为 ICallbackEventHandler  在往客户端注册脚本块或者已经注册了的脚本块会与

          FredCK.FCKeditorV2的核心JS 代码 关联产生冲突,导致注册的前台的脚本不能被后台方法所能接应的原因

 

     3写到这里只是个推算,但真的是这样的一个场景;所以实现的方法就只有改方法了

     4.以下是用 xmlHttp 实现的代码片段,解决上面的办法就是对  原本 DropDownList   引用 ICallbackEventHandler  注册的脚本块给不用,在源头这里换成XMLHTTP的方法就行,其中xmlHttp.ashx为返回结果的处理方法,是辅助此次无刷新任务完成添加的 处理方法,在里面根据参数返回一段特定格式的字符串

         1  <script type="text/javascript">

 2        function ReceiveServerData(rValue) {
 3            
 4             var listbox = document.getElementById("<%=InsertItemBox.ClientID %>");
 5             var list = rValue.split('|');
 6             for (var i = 0; i < list.length; i++) {
 7                 var name = list[i].split(',')[0];
 8                 var id = list[i].split(',')[1];
 9                 listbox.options[i] = new Option(name, id);
10             }
11 
12         }
13        
14         var XmlHttp;
15         XmlHttp = new ActiveXObject("Msxml2.XMLHTTP.5.0");
16         function send() {
17             //debugger;
18             XmlHttp.onreadystatechange = doHttpReadyStateChange;
19             var drop = document.getElementById("<%=DDL_MoldVersion.ClientID %>");
20             var select = drop.options[drop.selectedIndex].value;
21             XmlHttp.open("Post""xmlHttp.ashx?ID=" + select , true);
22             XmlHttp.send();
23         }
24 
25         function doHttpReadyStateChange() {
26             if (XmlHttp.readyState == 4) {
27                 var res = XmlHttp.responseText;
28                 ReceiveServerData(res);
29             }
30         }
31     </script>

         

          

 


 

posted @ 2009-11-26 13:51  小肖程序  阅读(825)  评论(1编辑  收藏  举报