在更新面板中显示带有文件上传的进度更新

Question

我正在使用VS2013和C＃（webforms）在asp.net中开发一个网站。 我有一个页面可以接受一些用户输入，包括<asp:FileUpload>服务器控件。 整个表单都位于更新面板中，这使我可以显示进度更新div，该进度更新div在用户提交表单时弹出。

我已经了解到，在更新面板中具有文件上传服务器控件会导致问题，因此我正在使用<asp:PostBackTrigger>强制回发，以便上传控件的.HasFile属性并不总是为false。

在整个站点中，当由于数据库活动而导致延迟时，我使用<asp:UpdatePanel>和<asp:UpdateProgress>向用户显示有一些活动，并保护该表单在用户点击后不会被更改或重新提交。提交。 工作正常。

问题在于<asp:PostBackTrigger>还会阻止<asp:UpdateProgress>出现。 这样会使表单容易在提交后遭到用户输入的干扰，并且也是不良的用户体验。 因此，我处于陷阱22 –无法删除PostBackTriggers，因为文件上传控件将无法使用，并且由于PostBackTriggers阻止了它的显示，因此我无法在提交时使用UpdateProgress。

一些代码：

 <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager> <asp:UpdatePanel ID="UpdatePanel1" runat="server"> <ContentTemplate> <%-- Some irrelevant code left out --%> <div class="row"> <div class="input-group col-sm-6"> <span class="input-group-addon" style="width: 175px; text-align: right;" id="basic-addon10">Signature</span> <asp:FileUpload ID="uplSignature" runat="server" CssClass="form-control" /> </div> <%-- Some irrelevant code left out --%> </ContentTemplate> <Triggers> <asp:PostBackTrigger ControlID="btnSubmit" /> </Triggers> <asp:UpdateProgress ID="UpdateProgress" runat="server" AssociatedUpdatePanelID="UpdatePanel1" DisplayAfter="0"> <ProgressTemplate> <div class="updateProgressMain" style="position: fixed;"> <div class="updateProgressDiv" style="position: fixed;"> <img src="Images/loader.gif" alt="" /> </div> </div> </ProgressTemplate> </asp:UpdateProgress> 

解决此问题的最佳方法是什么？

我在这里先向您的帮助表示感谢。

编辑 -我接受了Ajax控件工具包中的Ajax文件上载控件的使用作为答案，因为它确实可以解决我的问题。 我对此并不感到兴奋，因为我发现很难进行样式设置以使其与网站的外观和风格相匹配-但这确实有效。 谢谢你的建议。

Answer 1

我将看一下Ajax控件工具包附带的AjaxFileUpload控件。

以前我也遇到过类似的问题，请记住，ajax为我工作。

您可以在这里找到有关它的一些信息： https : //ajaxcontroltoolkit.devexpress.com/AjaxFileUpload/AjaxFileUpload.aspx

要获取Ajax Control Toolkit，只需在NuGet中进行搜索。