![](/img/trans.png)
[英]Asynchronous file upload inside a update panel and a dropdown to trigger postback not working
[英]UpdateProgress and trigger section not working in Update panel while implement file upload control asynchronously
我正在尝试使用更新面板中的asp.net文件上载控件上载图像文件。 我想处理UpdateProgress以显示进度条图像,该进度条图像指示进度以及文件上传。
情况1:当我删除触发器部分并使用UpdateProgress部分时,进度过程运行正常,但文件上传控件无法上传我的文件。 [ 页面未重新加载 ]
情况2:当我使用触发器部分并删除UpdateProgress部分时,文件被上传,但页面被重新加载。
预期:我真正想要的是一个很好的文件上传过程,该过程包括UpdateProgress以显示进度图像,并且严格没有页面加载。
我去过的是:
.aspx部分
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<asp:UpdateProgress ID="loading" runat="server">
<ProgressTemplate>
<asp:Image ID="Image1" CssClass="loadingGeneral" ImageUrl="../Images/loading(1).gif" AlternateText="Processing" runat="server" />
</ProgressTemplate>
</asp:UpdateProgress>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:FileUpload ID="fileUploadForAlbum" multiple="true" CssClass="buttonclass" runat="server" ToolTip="Click to browse image." />
<asp:Button ID="btn_uploadAlbum" runat="server" class="buttonclass" OnClick="btnUploadAlbum_Click" Text="Upload Slider" />
</ContentTemplate>
<Triggers>
<asp:PostBackTrigger ControlID="btn_uploadAlbum" />
</Triggers>
</asp:UpdatePanel>
.aspx.cs部分
文件上传代码部分很好,我已经使用下面的方法来实现进度条。
protected void btnUploadAlbum_Click(object sender, EventArgs e)
{
System.Threading.Thread.Sleep(2000);
do something.........
}
提前致谢。 任何帮助表示赞赏。
关于FileUpload
控件,有一些有趣的事实要知道。
1.)文件上传控件不适用于异步回发。 它总是需要回发才能正常工作。 这就是您看到整页回发的原因。
2.)AsyncPostbackTrigger在这里无法防止回发。
MSDN
明确指出:
The FileUpload control is designed to be used only in postback scenarios
and not in asynchronous postback scenarios during partial-page rendering.
When you use a FileUpload control inside an UpdatePanel control, the file must
be uploaded by using a control that is a PostBackTrigger object for the panel
这使得我们可以推断出第三点:
3.)我们需要使用PostBackTrigger
来使FileUpload
控件与UpdatePanel
,然后将进行整页的回发。
您的问题 :
What I really want is a fine file upload process that includes UpdateProgress
to show progress image and strictly with no page loads
对此的好答案之一是使用AsyncFileUpload
控件。 此控件的功能:
ThrobberID
属性在文件上传过程中显示加载图像。 CompleteBackColor
属性,如果上传失败,则使用ErrorBackColor
属性显示红色。 在.aspx
页面上,放置一个脚本管理器并注册Ajax控件工具包DLL。
<%@ Register Assembly="AjaxControlToolkit"
Namespace="AjaxControlToolkit" TagPrefix="ajaxasyncFU" %>
现在放置AsyncFileUpload
控件:
<ajaxasyncFU:AsyncFileUpload ID="AsyncFileUpload1" runat="server"
OnClientUploadError="uploadError" OnClientUploadStarted="StartUpload"
OnClientUploadComplete="UploadComplete"
CompleteBackColor="Lime" UploaderStyle="Modern"
ErrorBackColor="Red" ThrobberID="Throbber"
onuploadedcomplete="AsyncFileUpload1_UploadedComplete"
UploadingBackColor="#66CCFF" />
您可以使用3个客户端事件: OnClientUploadError
, OnClientUploadStarted
和OnClientUploadComplete
还有一个服务器端事件: onuploadedcomplete
,以异步方式调用,因此避免了整个页面的回发。 通常在此服务器事件中,我们保存文件:
protected void AsyncFileUpload1_UploadedComplete
(object sender, AjaxControlToolkit.AsyncFileUploadEventArgs e)
{
if (AsyncFileUpload1.HasFile)
{
string strPath = MapPath("~/MyImages/") + Path.GetFileName(e.filename);
AsyncFileUpload1.SaveAs(strPath);
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.