FileUpload与UpdatePanel
UpdatePanel是Asp.net实现页面部分刷新所使用的控件。还是挺不错的控件，避免了不少因为刷新所带来的不良用户体验(点击Asp.net按钮触发页面刷新，清楚text box中的内容)。但UpdatePanel是不能与FileUpload同时使用的。这也是微软明确指出的问题。同时使用FileUpload与UpdatePanel需要“耍点小聪明”。一个切实可行的方法是结合IFrame一起使用。使用UpdatePanel包含一个IFrame，然后写一个上传文件的页面，将这个页面放到IFrame里面。具体实现如下：
1. 在主页面Test.aspx中使用UpdatePanel包住Iframe
...
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<iframe id="uploadFile" name="uploadFile" src="FileUpload.aspx" style="border-style: none"></iframe>
</ContentTemplate>
</asp:UpdatePanel>
...
IFrame的src属性指向有FileUpload控件的页面FileUpload.aspx。
2. 在FileUpload.aspx页面中放置FileUpload控件
...
<asp:FileUpload ID="fileUploadImage" runat="server" />
<asp:Button ID="btnUploadImage" runat="server" Text="上传" OnClick="btnUploadImage_Click" />
...
这样就可以实现FileUpload与UpdatePanel同时使用。但这还远远不足！主页面需要和iframe中的页面进行交互才满足实际需求。交互可以通过JavaScript来实现。具体如下:
1. 在FileUpload.aspx(包含在iframe页面中的页面)调用主页面的JavaScript
在FileUpload.aspx中定义以下JavaScript:
function callBack()
{
var fileName = $("#hdfTmpPath").val();
window.parent.callBack(fileName); //调用主页面JavaScript
}
在主页面Test.aspx中定义被上面调用的JavaScript:
function callBack(fileName)
{
//运行代码或调用其他FileUpload.aspx中的JavaScript，传入的参数可以参与JavaScript的运行或传达到其他JavaScript中运行。
}
2. 在主页面Test.aspx调用FileUpload.aspx的JavaScript
在FileUpload.aspx中定义以下JavaScript供主页面调用:
function UploadWindowJavaScript(参数)
{
//运行代码或调用其他FileUpload.aspx中的JavaScript，传入的参数可以参与JavaScript的运行或传达到其他JavaScript中运行。
}
在主页面使用以下代码调用FileUpload.aspx中的JavaScript
document.getElementById("uploadFile").contentWindow.UploadWindowJavaScript(参数); //主页面调用FileUpload中的JavaScript
以上便是同时使用UpdatePanel和FileUpload控件的事例方法。
