如何在updatepanel上使用AsyncFileUpload在上传按钮单击时保存图像在文件夹中没有回发 [英] how to save image in folder using AsyncFileUpload in updatepanel on upload button click without postback

问题描述

我用了

 <   asp：UpdatePanel     ID   = < span class =code-keyword> UpdatePanel1    runat   =  server    
   
   UpdateMode   = 条件    ChildrenAsTriggers   =  true >  
 <   contenttemplate  >  
 
 <   asp ：AsyncFileUpload     ID   =  abcd1    runat   =  server   高度  =  25px   宽度  =  242px    OnClientUploadComplete   =  uploadComplete  
   
       ThrobberID   =  imgLoader    OnClientUploadStarted   =  uploadStarted    
   
   OnClientUploadError   =  uploadError      /  >  
 
 <   asp：按钮    ID   =  btnUpload    runat   =  server   文字  = 上传 < span class =code-attribute>   
   
  < span class =code-attribute> onclick   =  btnUpload_Click1    /  >  
 <   / contenttemplate  >  
 
 
 <  触发器 >  
 <   asp：PostBackTrigger     ControlID   =  btnUpload < span class =code-attribute>   /  >  
 <   / triggers  >  
 
 <   / div  >  

客户端代码：

< script type =   text / javascript language =   javascript> 
 
  function  uploadError（sender，args）{
  document 。 getElementById（'  lblStatus'）。innerText = args.get_fileName（），
  < span style = color：red;  > + args.get_errorMessage（）+   < /跨度>中; 
} 
 
  function  StartUpload（sender，args）{
  document  .getElementById（'  lblStatus'）。innerText = ' 上传已开始。'; 
} 
 
  function  UploadComplete（sender，args）{
  var  filename = args.get_fileName（）; 
  var  contentType = args.get_contentType（）; 
  var  text =  大小 + filename +  是 + args.get_length（）+   bytes; 
  if （contentType.length>  0 ）{
 text + = < span class =code-string> ，内容类型为 + contentType +  '。; 
} 
  document  .getElementById（'  lblStatus'）。innerText = text; 
} 
 
< / script> 

服务器端代码：

  protected   void  btnUpload_Click1（ object  sender，EventArgs e）
 {
  try  
 {
 HttpFileCollection uploadFiles = Request .Files; 
  for （ int  i =  0 ; i <  uploadFiles.Count; i ++）
 {
 HttpPostedFile uploadFile = uploadFiles [i]; 
  string  fileName = Path.GetFileName（uploadFile.FileName）; 
  if （fileName.Trim（）。Length >   0 ）
 {
 uploadFile.SaveAs（Server.MapPath（ 〜/ Files /）+ fileName）; 
 lblStatus.Text =  文件已成功上传; 
} 
} 
} 
  catch （例外情况）
 {
 lblStatus.Text =  上传文件时出错; 
} 
 
} 

当我点击按钮时如何避免所有页面反击？

我不使用 onuploadedcomplete 事件

解决方案

使用

 <  触发器 >  
 <   asp：AsyncPostBackTrigger     ControlID   =  btnUpload     EventName   = 点击    /  >  
 <   / triggers  >  

以上代码而非代码

 <  触发器 >  
 <   asp：PostBackTrigger    < span class =code-attribute> ControlID   =  btnUpload    /  >  
 <   / triggers  >  

<触发器>

< asp：postbacktrigger controlid =btnUploadxmlns：asp =＃unknown>

谢谢

我用它但是这个也没有用。

I used

<asp:UpdatePanel ID="UpdatePanel1" runat="server" 

UpdateMode="Conditional" ChildrenAsTriggers="true">
 <contenttemplate>

 <asp:AsyncFileUpload ID="abcd1" runat="server" Height="25px" Width="242px" OnClientUploadComplete="uploadComplete"

  ThrobberID="imgLoader" OnClientUploadStarted="uploadStarted" 

OnClientUploadError="uploadError"  />

   <asp:Button ID="btnUpload" runat="server" Text="Upload" 

onclick="btnUpload_Click1" />
  </contenttemplate>
                                                                                      
                                                                                
  <triggers>                                                                           
    <asp:PostBackTrigger ControlID="btnUpload" />
   </triggers>
   
    </div>

Client side code:

<script type="text/javascript" language="javascript">

       function uploadError(sender, args) {
           document.getElementById('lblStatus').innerText = args.get_fileName(),
	             "<span style="color:red;">" + args.get_errorMessage() + "</span>";
       }

       function StartUpload(sender, args) {
           document.getElementById('lblStatus').innerText = 'Uploading Started.';
       }

       function UploadComplete(sender, args) {
           var filename = args.get_fileName();
           var contentType = args.get_contentType();
           var text = "Size of " + filename + " is " + args.get_length() + " bytes";
           if (contentType.length > 0) {
               text += " and content type is '" + contentType + "'.";
           }
           document.getElementById('lblStatus').innerText = text;
       }

   </script>

Server side code:

protected void btnUpload_Click1(object sender, EventArgs e)
{
try
{
    HttpFileCollection uploadFiles = Request.Files;
    for (int i = 0; i < uploadFiles.Count; i++)
    {
        HttpPostedFile uploadFile = uploadFiles[i];
        string fileName = Path.GetFileName(uploadFile.FileName);
        if (fileName.Trim().Length > 0)
        {
            uploadFile.SaveAs(Server.MapPath("~/Files/") + fileName);
               lblStatus.Text = "File Uploaded Successfully";
        }
    }
}
catch (Exception ex)
{
     lblStatus.Text = "Error in uploading file";
}

}

how to avoid all page poastback when I click on button?
I dont use the onuploadedcomplete event

解决方案

Use

<triggers>                                                                           
    <asp:AsyncPostBackTrigger ControlID="btnUpload" EventName="Click" />
   </triggers>

Above code instead of your code

<triggers>                                                                           
    <asp:PostBackTrigger ControlID="btnUpload" />
   </triggers>

<triggers>
<asp:postbacktrigger controlid="btnUpload" xmlns:asp="#unknown">
Thanks
I use it but this is also not working.

这篇关于如何在updatepanel上使用AsyncFileUpload在上传按钮单击时保存图像在文件夹中没有回发的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！