要求
我正在尝试上传文件,只要用户选择它。我必须满足以下要求:
onchange
)事件进行完整回发。 当前代码
以下是我的 View 文件的外观:
<asp:UpdatePanel ID="upData" UpdateMode="Conditional" runat="server">
<ContentTemplate>
<div style="width: auto; float: right;">
<asp:Button ID="btnFileImportSkin" CssClass="ButtonSkin AddButton" Text="Import" Style="position: absolute; z-index: 2;" runat="server" OnClientClick="Javascript:onImport(); return false;" />
<asp:FileUpload ID="fileImport" Visible="false" Style="position:relative; opacity:0;" runat="server" onchange="Javascript:onFileSelected();" />
<%-- onchange="Javascript:this.form.submit();" /> --%>
<%-- <asp:Button ID="btnUpload" runat="server" OnClientClick="Javascript:alert('Uploading...'); __doPostBack('<%= btnUpload.ID %>', ''); return false;" /> --%>
<asp:Button ID="btnUpload" OnClick="btnUpload_Click" runat="server" />
</div>
</ContentTemplate>
<Triggers>
<asp:PostBackTrigger ControlID="btnUpload" />
</Triggers>
</asp:UpdatePanel>
相关的Javascript:
<script type="text/javascript">
function onImport() {
var fileImportClientId = '<%= fileImport.ClientID %>';
document.getElementById(fileImportClientId).click();
}
function onFileSelected() {
alert("File Selected");
// I have tried calling the function directly and with a timeout
setTimeout(onUpload, 20);
}
function onUpload() {
var btnUploadClientId = '<%= btnUpload.ClientID %>';
document.getElementById(btnUploadClientId).click();
}
</script>
后面的代码:
protected void btnUpload_Click(object sender, EventArgs e)
{
// PostedFile is null first time code gets here on user selecting a file
if (fileImport.PostedFile != null)
{
if (fileImport.PostedFile.FileName.Length > 0)
{
ImportFromFile();
}
}
}
解释/流程
btnFileImportSkin
按钮。 onImport
被调用,它以编程方式点击 fileimport
按钮。 onFileSelected
叫做。 onUpload
被成功调用。 btnUpload_Click
每次都调用成功。 然而 问题 就是它
用户第一次选择文件时,fileImport.PostedFile 为 null。第二次一切正常,从那时起。
相关
This question与我的问题密切相关,但 OP 可能想要像 Gmail 中的异步上传解决方案。我已经尝试在这个问题的答案中执行以下操作:
btnUpload
的 OnClientClick 事件中的 __doPostBack() FileUpload
的 this.form.submit() onchange 事件控制。 FileUpload
的 onchange 属性Page_PreRender 中的控制 附加说明
FileUpload
的 onchange 事件中直接执行 this.form.submit()控制。 注意:在
FileUpload
中添加了 Visible="false"控制上面。这是问题所在,但我在提问时忽略了它。
最佳答案
当针对 .Net 4.5 和 4.0 框架版本时,此代码适用于我。我将您的代码复制/粘贴到一个新的 Web 窗体应用程序中,并且在这两种情况下 fileImport.PostedFile 都不为空,而是包含我选择的图像的流。
您页面上的任何其他标记是否存在问题?或者你的页面生命周期?您在用户控件或 Web 表单页面上发布的 html/javascript 是什么?
关于asp.net - 第一次无法在更新面板内自动将文件上传到服务器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34227505/