Customization "Align all the Button in one line"

Last post 04-23-2009, 8:00 PM by cutechat. 3 replies.
Sort Posts: Previous Next
  •  04-22-2009, 4:04 AM 51356

    Customization "Align all the Button in one line"

    Hi our client want something like this
     
     
     
    Can any one help me out in this as i am new to ajax uploader.
     
    i want mainly 3 things

    1. How to align all the button on the top in one line (already try as mention in Demo application but not get any solution)
    2. How to give scroll bar if number of file list increase in Queue table
    3. How to open select file dialog when user open the page for the first time

    regards
    Prabhu




    Prabhudatta Tripathy
    Software Engineer
    www.brandsystems.com




  •  04-23-2009, 9:47 AM 51431 in reply to 51356

    Re: Customization "Align all the Button in one line"

    Prabhu
     
    Here is a sample for you :
     
     
    1. <%@ Page Language="C#" Title="First sample" %>  
    2.   
    3. <%@ Import Namespace="CuteWebUI" %>  
    4. <%@ Register TagPrefix="CuteWebUI" Namespace="CuteWebUI" Assembly="CuteWebUI.AjaxUploader" %>  
    5. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">  
    6.   
    7. <script runat="server">  
    8.   
    9.     void InsertMsg(string msg)   
    10.     {   
    11.         ListBoxEvents.Items.Insert(0, msg);   
    12.         ListBoxEvents.SelectedIndex = 0;   
    13.     }   
    14.     protected void UploadAttachments1_AttachmentAdded(object sender, AttachmentItemEventArgs args)   
    15.     {   
    16.         InsertMsg("Added.." + args.Item.FileName);   
    17.     }   
    18.   
    19. </script>  
    20.   
    21. <html xmlns="http://www.w3.org/1999/xhtml">  
    22. <head id="Head1" runat="server">  
    23.   
    24.     <script type="text/javascript">  
    25.         var uploaderid='<%=UploadAttachments1.ClientID %>';   
    26.         function DoCancelAll()   
    27.         {   
    28.             var uploader=document.getElementById(uploaderid);   
    29.             uploader.cancelall();   
    30.         }   
    31.         function DoSubmit()   
    32.         {   
    33.             var uploader=document.getElementById('<%=UploadAttachments1.ClientID %>');   
    34.             var submitbutton=document.getElementById('<%=SubmitButton.ClientID %>');   
    35.             if(!window.filesuploaded)   
    36.             {   
    37.                 if(uploader.getqueuecount()>0)   
    38.                 {   
    39.                     uploader.startupload();   
    40.                 }   
    41.                 else   
    42.                 {   
    43.                     alert("Please browse files for upload");   
    44.                 }   
    45.                 return false;   
    46.             }   
    47.             window.filesuploaded=false;   
    48.             return true;   
    49.         }   
    50.            
    51.         function CuteWebUI_AjaxUploader_OnPostback()   
    52.         {   
    53.             window.filesuploaded=true;   
    54.             var submitbutton=document.getElementById('<%=SubmitButton.ClientID %>');   
    55.             submitbutton.click();   
    56.             return false;   
    57.         }   
    58.            
    59.         function CuteWebUI_AjaxUploader_OnQueueUI(list)   
    60.         {   
    61.             var container=document.getElementById("queuediv");   
    62.             if(list.length<2)   
    63.             {   
    64.                 container.style.display="none";   
    65.                 return false;   
    66.             }   
    67.                
    68.             var activerowindex=-1;   
    69.                
    70.             container.style.display="";   
    71.             container.innerHTML="";   
    72.                
    73.             var table=document.createElement("table");   
    74.             table.style.borderCollapse="collapse";   
    75.             table.cellSpacing=0;   
    76.             table.cellPadding=4;   
    77.             table.border=1;   
    78.             table.borderColor="darkgreen";   
    79.             table.style.fontSize="9pt";   
    80.   
    81.             for(var i=0;i<list.length;i++)   
    82.             {   
    83.                     var name=listIdea.FileName   
    84.                     var size=listIdea.FileSize // (or -1)   
    85.                     var stat=listIdea.Status // Finish|Error|Upload|Queue   
    86.                     var func=listIdea.Cancel;   
    87.                     var row=table.insertRow(-1);   
    88.                     row.insertCell(-1).innerHTML=name;   
    89.                     var last=row.insertCell(-1);   
    90.                     if(stat=="Queue")   
    91.                     {          
    92.                             var btn=document.createElement("A");   
    93.                             btn.href="BLOCKED SCRIPTvoid(0)";   
    94.                             btn.onclick=func;   
    95.                             btn.innerHTML="cancel";   
    96.                             last.appendChild(btn);   
    97.                     }   
    98.                     else   
    99.                     {   
    100.                             last.innerHTML=stat;   
    101.                             if(stat=="Upload")   
    102.                                 activerowindex=i;   
    103.                     }   
    104.             }   
    105.             container.appendChild(table);   
    106.                
    107.             if(activerowindex>1)   
    108.             {   
    109.                 container.scrollTop=Math.floor(container.scrollHeight*(activerowindex-1)/list.length);   
    110.             }   
    111.                
    112.             return false; //hide the default;   
    113.         }   
    114.     </script>  
    115.   
    116. </head>  
    117. <body>  
    118.     <form id="Form1" runat="server">  
    119.            
    120.         <div>  
    121.             <table>  
    122.                 <tr>  
    123.                     <td>  
    124.                         <input type="button" id="BrowseButton" onclick="return false;" value="Broswe Files" />  
    125.                     </td>  
    126.                     <td>  
    127.                         <input type="button" onclick="DoCancelAll();return false;" value="Cancel All" />  
    128.                     </td>  
    129.                     <td>  
    130.                         <asp:Button runat="server" ID="SubmitButton" OnClientClick="return DoSubmit()" Text="Submit" />  
    131.                     </td>  
    132.                 </tr>  
    133.             </table>  
    134.         </div>  
    135.         <div>  
    136.             <CuteWebUI:UploadAttachments runat="server" ID="UploadAttachments1" OnAttachmentAdded="UploadAttachments1_AttachmentAdded"  
    137.                 NumFilesShowCancelAll="1000" InsertButtonID="BrowseButton" ManualStartUpload="true">  
    138.             </CuteWebUI:UploadAttachments>  
    139.         </div>  
    140.         <hr />  
    141.         <div id="queuediv" style="height: 100px; overflow-y: scroll; display: none">  
    142.         </div>  
    143.         <br />  
    144.         <div>  
    145.             Server Trace:   
    146.             <br />  
    147.             <asp:ListBox runat="server" ID="ListBoxEvents" Width="800"></asp:ListBox>  
    148.         </div>  
    149.     </form>  
    150. </body>  
    151. </html>  
    Regards,
    Terry
  •  04-23-2009, 3:30 PM 51457 in reply to 51431

    Re: Customization "Align all the Button in one line"

    Hi Terry
            
             thanks a lot for your help.

    Regards,
    Prabhu


    Prabhudatta Tripathy
    Software Engineer
    www.brandsystems.com




  •  04-23-2009, 8:00 PM 51466 in reply to 51457

    Re: Customization "Align all the Button in one line"

    Hi,
     
    When you work on that sample , please change the Idea to [ i ] .
     
    Regards,
    Terry
     
View as RSS news feed in XML