让Atlas UpdatePanel和自定义控件携手合作

    如果你用过Atlas 中的UpdatePanel,一定会喜欢上这个东东,简单易用,几乎不需要写任何代码,就可以实现页面的局部刷新功能,是在是爽呆了。可是这玩意也有失灵的时候,特别是一些大量使用了JavaScript的自定义的控件或第三方控件。当这些控件被包含在UpdatePanel中,几乎百分百的失败率。据我的研究发现,之所以造成这些控件失败,主要是因为Ajax方式造成的,当UpdatePanel从Server端取回更新完成的代码,就会设置UpdatePanel在客户端中的容器控件Div的innerHTML属性,这种情况下包含其中的JavaScript不会得到执行,所以依赖它们的控件就失效了!那么是不是只能放弃个好东东呢?作为程序员怎能轻言放弃呢?
    那么怎么才能让这些控件恢复工作呢。我发现这时还分为两种情况:
    一、第一次呈现页面时,控件是可见的。这时候控件引用或者直接输出的JavaScript函数得到了执行,其中立即执行的代码也得到了执行,所以这时候控件是可用的。但是当页面部分刷新之后,情况就复杂了;
    1.如果控件中不包含立即执行的代码或者不包含控件根据不同情况输出的变化的JavaScript代码,那么控件依然是可用的,因为第一次Render页面时JavaScript已经得到了注册,控件的事件中调用Javascript代码是不会有问题的!这种情况下,控件是和UpdatePanel兼容的,我们不需要干预。
    2如果控件每次根据状态不同,直接输出JavaScript代码到HTML中,那么可以说这种控件是完全不兼容的,因为让它工作需要作的是不能确定的!
    3.控件在HTML属性中保持状态,只是有限度的立即执行一段创建Object的代码,这种情况下,我们可以让控件恢复工作。因为UpdatePanel在浏览器中呈现为Div,而每次设置div的innerHTML属性的时候,都会触发onpropertychange事件〔我只知道IE可以,别的浏览器有无此事件恕我不知道:(〕,所以我们可以在这个事件中执行控件中需要执行的这小段代码,那么控件就会恢复工作了(什么,你不知道执行什么代码,我帮不了你了:) )!
 <script >
      
function createDicTree()UserTreeObj=new DictionaryTree('UserTree');}
      
var UserTreeObj;
      dd
=document.getElementById("UpdatePanelForm");
      dd.attachEvent('onpropertychange',createDicTree); 
 
</script>
上面这段代码中的函数内容就是DictionaryTree这个自定义控件的初始化代码,被附加到div的事件中后,这个控件就恢复工作了。
    二、第一次呈现页面时,控件是不可见的,只有触发事件之后才由UpdatePanel呈现出来,由于Server 端控件的隐藏意味着根本没有Render到客户端浏览器中,所以控件中的脚本注册和脚本立即执行代码相当于都没有机会获得执行!这种情况,如果你能够把控件的脚本引用找出来,然后自己放置到页面中其他位置使其能够注册执行,然后再结合上面的方法,也是可以解决的。或者不要在server端设置隐藏,而是在客户端设置隐藏,这样就不存在这第二种情况了。
posted @ 2006-05-22 23:17  柒零壹  阅读(1687)  评论(0编辑  收藏  举报