After UI customization of Ajaxuploader , .CS file events never get fired

Last post 03-26-2010, 12:07 PM by pi2. 2 replies.
Sort Posts: Previous Next
  •  12-28-2009, 8:18 PM 57957

    After UI customization of Ajaxuploader , .CS file events never get fired

    While working with UI customization of Ajaxuploader using custom Queue table method as mentioned in Documentation (with ASP.NET and C#). 

    Am facing strange problem when we use custom queue method as shown below 

    var uploader=document.getElementById("<%=UploadAttachments1.ClientID %>");

    uploader.handlequeueui=myqueueuihandler; 

    Now when we use Javascript based UI customization Our .CS file events never get fired up, that event  gets  blocked. Due to which we are not able to save the files physically on our server. 

    Basically we want our code control to come to below shown code event whenever a file is uploaded: 

        protected void UploaderAssets_FileUploaded(object sender, UploaderEventArgs args)

     Please  let us know the way to resolve it ASAP.

  •  12-28-2009, 10:47 PM 57959 in reply to 57957

    Re: After UI customization of Ajaxuploader , .CS file events never get fired

    Hi flotest,
     
    It works fine for me.
     
    Please test the example below.
     
    1. <%@ Page Language="C#" Title="Customize the queue UI" %>   
    2.   
    3. <%@ Register TagPrefix="CuteWebUI" Namespace="CuteWebUI" Assembly="CuteWebUI.AjaxUploader" %>   
    4. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">   
    5.   
    6. <script runat="server">   
    7.   
    8.     protected void UploadAttachments1_FileUploaded(object sender, UploaderEventArgs args)   
    9.     {   
    10.         ClientScript.RegisterClientScriptBlock(this.GetType(), "showFileNmae""<script>alert('" + args.FileName + "')</" + "script>");   
    11.     }   
    12. </script>   
    13.   
    14. <html xmlns="http://www.w3.org/1999/xhtml">   
    15. <head id="Head1" runat="server">   
    16. </head>   
    17. <body>   
    18.     <form id="Form1" runat="server">   
    19.         <div>   
    20.             <asp:LinkButton runat="server" ID="BrowseButton" Text="Select Files To Upload" />   
    21.         </div>   
    22.         <div id="queuediv" style="display: none;">   
    23.             <div id="queuedivtablecontainer">   
    24.             </div>   
    25.             <div style="font-size: larger; padding-left: 100px; margin: 4px;">   
    26.                 <a href="#" onclick="cancelalltasks();return false;">Cancel all tasks.</a>   
    27.             </div>   
    28.         </div>   
    29.         <div>   
    30.             <CuteWebUI:UploadAttachments runat="server" ID="UploadAttachments1" InsertButtonID="BrowseButton"  
    31.                 OnFileUploaded="UploadAttachments1_FileUploaded">   
    32.             </CuteWebUI:UploadAttachments>   
    33.         </div>   
    34.     </form>   
    35. </body>   
    36.   
    37. <script>   
    38. var uploader=document.getElementById("<%=UploadAttachments1.ClientID %>");   
    39. uploader.handlequeueui=myqueueuihandler;   
    40. function myqueueuihandler(list)   
    41. {   
    42.     if(list.length<2)   
    43.     {   
    44.         document.getElementById("queuediv").style.display="none";   
    45.     }   
    46.     else  
    47.     {   
    48.         document.getElementById("queuediv").style.display="";   
    49.         var container=document.getElementById("queuedivtablecontainer");   
    50.         container.innerHTML="";   
    51.            
    52.         var table=document.createElement("table");   
    53.         table.style.borderCollapse="collapse";   
    54.         table.cellSpacing=0;   
    55.         table.cellPadding=4;   
    56.         table.border=1;   
    57.         table.borderColor="darkgreen";   
    58.   
    59.         for(var i=0;i<list.length;i++)   
    60.         {   
    61.             var name=list[i].FileName   
    62.             var size=list[i].FileSize // (or -1)   
    63.             var stat=list[i].Status // Finish|Error|Upload|Queue   
    64.             var func=list[i].Cancel;   
    65.                
    66.             var row=table.insertRow(-1);   
    67.                
    68.             row.insertCell(-1).innerHTML=name;   
    69.                
    70.             var last=row.insertCell(-1);   
    71.             if(stat=="Queue")   
    72.             {   
    73.                 var btn=document.createElement("A");   
    74.                 btn.href="BLOCKED SCRIPTvoid(0)";   
    75.                 btn.onclick=func;   
    76.                 btn.innerHTML="Cancel";   
    77.                 last.appendChild(btn);   
    78.             }   
    79.             else  
    80.             {   
    81.                 last.innerHTML=stat;   
    82.             }   
    83.         }   
    84.            
    85.         container.appendChild(table);   
    86.     }   
    87.     return false//hide the default;   
    88. }   
    89. function cancelalltasks()   
    90. {   
    91.     uploader.cancelall();   
    92. }   
    93. </script>   
    94.   
    95. </html>  
    Keep me posted.
     
    Regards,
     
    Ken
  •  03-26-2010, 12:07 PM 59676 in reply to 57959

    Re: After UI customization of Ajaxuploader , .CS file events never get fired

    I like the way the progress bar looks and it's location with this code.
     
    What I don't like is the table after the upload showing and the table that shows up under the InsertButtonID during the upload.
     
    How would I get those two to not show up?
View as RSS news feed in XML