众所周知微软所提供的updatepanel不能支持文件上传的异步刷新，但是往往当你在项目中的其他页面实现了异步刷新之后，客户就会问你为什么有文件上传的页面就不能实现异步刷新呢？这时我们可能说一堆理由，但是最后大部分还是会妥协于客户。 具体我们如何实现文件的异步刷新，目前网上已经有了很多文章来解决这个问题，但是会用到大量的javascript,由于本人编码功力尚浅，所以之今没有高清其中的所以然，但是在解决的方案中他们貌似都用到了iframe，这让我茅塞顿开，所以我就说说用这个处理刷新的思路。
首先一个实际的页面中往往是会有较多的内容，我们暂时把它分为A，B两个区域，A区域是内容区域，我们可以用updatepanel来实现异步刷新，B区域是上传区域，我们用div已经ifame占位，其中上传的具体功能实现我们可以放到C页面中，这样当点击按钮刷新B区域的时候，我们可以向C页面传值来更新里面的内容，同样当我们点击按钮删除或者保存内容时，也可以获取C页面中的内容，这样就基本上满足了无刷新的感觉。

其实这种方式并不能称之为异步刷新，因为我们只是用iframe来实现页面的局部刷新从而满足一种无刷新的感觉而已。

如果这样处理的话，asp.net页面与iframe之间的传值就会成为另一个问题，其实这个问题如果你知道，就会比较简单，但是不知道的话，就有点无从下手。
网上可能也提供了很多方案处理传值，我使用的是使用javascript来获取控件从而取到他里面所包含的值。

这个是获取iframe f1,以及页面C中的 img控件
var objFrame = document.getElementById("f1");
var objPicture = objFrame.contentWindow.document.getElementById("imgPicture");
当然你也可以在页面C中去获取父页面的控件，从而获取值
var objHid = this.parent.document.getElementById("")

这个是包含ifrmae的div
<div id="iconpicture">
<iframe id="f1" style="width: 300px; height: 300px" src="UploadImage.aspx" scrolling="no"
frameborder="0" border="0" frameborder="no"></iframe>
</div>

这个实现方式我已经在项目中成功的使用了，其实如果这样处理主要的难点已经不再于具体功能的实现，而在于页面的布局在多浏览器下的适应了。当然我提供的这些javascript 是满足多浏览器的。

评论 (0) All

登陆 还没注册？