locked
Upload Files RRS feed

All replies

  • User665608656 posted

    Hi jsshivalik,

    I want to select files one by one & then Upload all.  I am following below link. Secondly i want Good UI

    There is a simpler way to upload multiple files with more beautiful ui.

    Here is full code, you can refer to it:

    <!DOCTYPE html>
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
        <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" />
        <link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-fileinput/4.3.1/css/fileinput.css" rel="stylesheet" />
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>
        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-fileinput/4.3.1/js/fileinput.js"></script>
    
    
    </head>
    <body>
        <form id="form1" runat="server">
            <div class="container">
                <div class="form-group">
                   <label class="col-sm-9 control-label">
    Multiple File Upload
    </label>
    <div class="col-sm-9">
    <span class="btn btn-default btn-file">
    <input id="input-2" name="input2[]" type="file" class="file" multiple data-show-upload="true" data-show-caption="true" />
    </span>
    </div> </div> </div> </form> </body> </html>

    The result of this work demo:

    There also other design with this function , you could also refer to this link : File Upload - Multiple Uploads

    Best Regards,

    YongQing.

    Thursday, August 1, 2019 8:57 AM
  • User-2054057000 posted

    Hi

      I want to select files one by one & then Upload all.  I am following below link. Secondly i want Good UI

    https://www.c-sharpcorner.com/UploadFile/71c5a7/multiple-file-upload-in-Asp-Net585/

    Thanks

    There are 2 very good ASP.NET Upload file tutorials that work without postback that is with AJAX. Check these links:

    1. File upload with JavaScript
    2. File upload with jQuery
    Thursday, August 1, 2019 9:13 AM
  • User-1038772411 posted

    Hello, jsshivalik

    in your .aspx code :

    <div>  
       <asp:FileUpload runat="server" ID="UploadImages" AllowMultiple="true" />  
       <asp:Button runat="server" ID="uploadedFile" Text="Upload" OnClick="uploadFile_Click" />  
       <asp:Label ID="listofuploadedfiles" runat="server" />  
    </div> 

    Below code use in code behind .cs files:

    protected void uploadFile_Click(object sender, EventArgs e) {  
        if (UploadImages.HasFiles) {  
            foreach(HttpPostedFile uploadedFile in UploadImages.PostedFiles) {  
                uploadedFile.SaveAs(System.IO.Path.Combine(Server.MapPath("~/Images/"), uploadedFile.FileName));  
                listofuploadedfiles.Text += String.Format("{0}<br />", uploadedFile.FileName);  
            }  
        }  
    }  

    If you have UI issue means you want proper UI in this please use bootstrap for customise UI.

    Refer LInk :

    https://www.c-sharpcorner.com/UploadFile/99bb20/upload-multiple-files-using-fileupload-control-in-Asp-Net-4/

    Thursday, August 1, 2019 9:57 AM
  • User-797751191 posted

    Hi Yong

     That's good but i want that user should select file 1 by one and then Upload all files together. 

    Thanks

      

    Thursday, August 1, 2019 11:51 AM
  • User-1038772411 posted

    Hello, jsshivalik

    If we set [AllowMultiple="true"] it means in that case we eligible to select multiple files right and also you can do with this senerio.

    Thanks

    Friday, August 2, 2019 6:36 AM
  • User665608656 posted

    Hi jsshivalik,

     That's good but i want that user should select file 1 by one and then Upload all files together. 

    To achieve this function , I have found a very useful interface.

    You can refer to this link: https://www.igniteui.com/file-upload/api-events

    Here's a demonstration:

    Best Regads,

    YongQing.

    Friday, August 2, 2019 9:53 AM