User selected directory for upload

3 posts, 0 answers
  1. Matthew
    Matthew avatar
    5 posts
    Member since:
    Aug 2012

    Posted 03 Feb 2014 Link to this post

    I'd like to provide a dropdown list of names to be used as part of the path to store files using the upload widget. Specifically, I'm using usernames as the directory name to store files. I have already figured out how to achieve this when the user is the one uploading files, however when an administrator does it then I need for them to be able to select the directory to upload the files to.
  2. Dimiter Madjarov
    Admin
    Dimiter Madjarov avatar
    2153 posts

    Posted 04 Feb 2014 Link to this post

    Hello Matthew,


    I am not sure that I completely understand the scenario with the users and the administrators. Nevertheless if you are referring to setting the saveUrl property of the Upload widget dynamically, you could achieve this in the upload event handler.
    E.g.
    function onUpload(e) {
        this.options.async.saveUrl = "newUrl";
    }


    Regards,
    Dimiter Madjarov
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. UI for ASP.NET MVC is VS 2017 Ready
  4. Matthew
    Matthew avatar
    5 posts
    Member since:
    Aug 2012

    Posted 05 Feb 2014 in reply to Dimiter Madjarov Link to this post

    Thanks for your prompt response. I ended up figuring it out. I've posted the code below for reference.
    View:
    @model IEnumerable<Project.Models.UploadInitialFile>
    @using Kendo.Mvc.UI;
     
    @Html.DropDownList("UserProfileId")
     
    @(Html.Kendo().Upload()
            .Name("files")
            .Events(ev => ev
                .Upload("onUpload")
                .Remove("onRemove"))
            .Async(a => a
                .Save("SaveAndPersist", "Upload")
                .Remove("RemoveAndPersist", "Upload")
                .AutoUpload(true)
            )
            .Files(files =>
                {
                    foreach (var f in Model)
                    {
                        files.Add().Name(f.Name).Extension(f.Extension).Size(f.Size);
                    }
                })
            )
     
    <script>
        function onUpload(e) {
            e.data = { userProfileId: $('#UserProfileId').val() };
        }
     
        function onRemove(e) {
            e.data = { userProfileId: $('#UserProfileId').val() };
        }
    </script>
     
    // Controller:
     
    public ActionResult Index()
            {
                // Get current user info
                ViewBag.UserProfileId = new SelectList(db.UserProfiles, "UserProfileId", "FullName");
     
                // Redisplay uploaded files to user after initial upload, gives them the option to delete them at that moment as well
                IList<UploadInitialFile> initialFiles =
                    SessionUploadInitialFilesRepository.GetAllInitialFiles();
     
                return View(initialFiles);
            }
     
    public async Task<ActionResult> SaveAndPersist(IEnumerable<HttpPostedFileBase> files, int? userProfileId)
            {
                // The Name of the Upload component is "files"
                if (files != null && userProfileId != null)
                {
                    UserProfile up = await db.UserProfiles.FindAsync(userProfileId);
                    var userDirectory = Path.Combine(Server.MapPath(ConfigurationManager.AppSettings["ClientUploadDirectory"]), up.UserName.ToString());
     
                    // If current user doesn't have a directory in the uploads folder then create one
                    if (!System.IO.Directory.Exists(userDirectory))
                    {
                        System.IO.Directory.CreateDirectory(userDirectory);
                    }
                    foreach (var file in files)
                    {
                        // Some browsers send file names with full path.
                        // We are only interested in the file name.
                        var fileName = Path.GetFileName(file.FileName);
                        var physicalPath = Path.Combine(userDirectory, fileName);
                        var fileExtension = Path.GetExtension(file.FileName);
     
                        SessionUploadInitialFilesRepository.Add(new UploadInitialFile(fileName, file.ContentLength, fileExtension));
     
                        // The files are saved in a userId named directory in the Uploads folder
                        file.SaveAs(physicalPath);
                    }
                }
     
                // Return an empty string to signify success
                return Content("");
            }

    @Html.DropDownList("UserProfileId")

     @(Html.Kendo().Upload()
            .Name("files")
            .Events(ev => ev
                .Upload("onUpload")
                .Remove("onRemove"))
            .Async(a => a
                .Save("SaveAndPersist", "Upload")
                .Remove("RemoveAndPersist", "Upload")
                .AutoUpload(true)
            )
            .Files(files =>
                {
                    foreach (var f in Model)
                    {
                        files.Add().Name(f.Name).Extension(f.Extension).Size(f.Size);
                    }
                })
            )
Back to Top