当前位置: 首页 > 面试题库 >

Asyncfileupload文件预览不显示

鲁景山
2023-03-14
问题内容

我在更新面板中有一个Ajax异步文件上传控件。我的上传效果很好,但是上传完成后,我需要查看上传的图片。但这不起作用是我所做的

function UploadComplete(sender, args) {
        var filename = args.get_fileName();
        var contentType = args.get_contentType();
        if (contentType.indexOf('image') == -1) {
            document.getElementById('<%=lblStatus.ClientID%>').innerText = "Uploaded file must be an Image!"+ "<span style='color:red;'>" + args.get_errorMessage() + "</span>";
            document.getElementById('<%=AsyncFileUpload1.ClientID%>').text.style.backgroundColor = "Red";
        }
        else {
            var text = "" + filename + "      |      " + args.get_length() + " bytes"+"Uploaded Succesfully";
            document.getElementById('<%=lblStatus.ClientID%>').innerText = text;
              $get("imageView1").src = "./~/" + filename;
        }
    }

AspCode:

<ajaxToolkit:AsyncFileUpload ID="AsyncFileUpload1" Width="400px" runat="server"    
        OnClientUploadError="uploadError"    
        OnClientUploadStarted="StartUpload"  
        OnClientUploadComplete="UploadComplete"  
        CompleteBackColor="Lime" UploaderStyle="Modern"    
        ErrorBackColor="Red" ClientIDMode="AutoID"    
        ThrobberID="Throbber"    
        UploadingBackColor="#66CCFF" 
            onuploadedcomplete="AsyncFileUpload1_UploadedComplete" />

 <asp:Label ID="Throbber" runat="server" Style="display: none">
 <asp:Image runat="server" ID="imgPreview" ImageUrl="~/Images/uploading.gif" />
        </asp:Label>
        <img runat="server" id="imageView1"/>
 <asp:Label ID="lblStatus" runat="server" Style="font-family: Arial; font-size: small;"></asp:Label>

问题答案:

您可以使用OnUploadedComplete事件显示图像。

<ajaxToolkit:AsyncFileUpload ID="AsyncFileUpload1" Width="400px" runat="server" OnUploadedComplete="ProcessUpload"

protected void ProcessUpload(object sender, AjaxControlToolkit.AsyncFileUploadEventArgs e)
{
string fileName = Server.MapPath("./") + "image.jpg";
AsyncFileUpload1.SaveAs(fileName);

ScriptManager.RegisterClientScriptBlock(AsyncFileUpload1, AsyncFileUpload1.GetType(), "img",
    "top.document.getElementById('imgUpload').src='image.jpg';", 
    true);
}

有关如何显示预览的详细信息,请看以下示例:具有AsyncFileUpload控件的ASP.NET中的AJAX文件上传



 类似资料:
  • 我有上传文档按钮,从那里我可以上传图像,文档,pdf文件和EXCEL。我想显示这些选定文件的预览。 我能够显示预览的图像和PDF文件,但不知道如何显示预览,如果文件是文档或excel文件。 下面是显示文件预览的通用代码。 超文本标记语言代码是: JS代码是: 如果选择的文件是PDF和/或图像,但不适用于doc或excel文件,则此代码可以正常工作。任何想法如何显示文档和excel文件的预览?

  • Seafile 专业版服务器支持在线预览 office 文件,配置方法如下。 安装 Libreoffice/UNO Office 预览依赖于 Libreoffice 4.1+ 和 Python-uno 库。 Ubuntu/Debian: sudo apt-get install libreoffice libreoffice-script-provider-python poppler-utils

  • 在VS2012中,当您在解决方案资源管理器中选择一个文件时,它会在一个特殊的“预览”选项卡中自动打开该文件。 也许我的电脑不够快,但是这个预览对我来说太慢了。 如何禁用此功能?

  • 本文向大家介绍WinForm中如何预览Office文件,包括了WinForm中如何预览Office文件的使用技巧和注意事项,需要的朋友参考一下 本文为大家分享了WinForm预览Office文档的方法,供大家参考,具体内容如下 使用WinForm, WPF, Office组件 原理:使用Office COM组件将Word,Excel转换为XPS文档, 将WPF的DocumentViewer控件寄宿

  • 在项目中的static里放了pdf.js,预览后台把DOC、DOCX转为PDF格式的文档可以搜索文字,但是直接预览PDF格式的文档就不能使用搜索了,是什么原因呢?

  • vue2.0移动端使用pdfjs-dist预览文件,在ios文件内容多显示不全(>50页) 内容少可以正常显示,在安卓端无问题都可以正常显示 想要的效果:pdf文件预览内容正常显示 使用的pdfjs-dist@2.2.228,具体代码如下: