'How to automatically upload file after file has been chosen

I have the following code for uploading a file in my site:

@using (Html.BeginForm("UploadProfileImage", "Member", FormMethod.Post, new { @encType = "multipart/form-data" }))
   {

     @Microsoft.Web.Helpers.FileUpload.GetHtml(initialNumberOfFiles: 1, includeFormTag: false, uploadText: "Upload File",allowMoreFilesToBeAdded:false)
    <span class="success">@ViewData["SuccessMessage"]</span>
     <input class="button" type="submit" name="submit" value="Upload" />         

}

I want this to be able to automatically post after the user selects the file from the "browse" button. Currently, the user has to click upload every time the user chooses a file to upload, anyway to make this process automatic?



Solution 1:[1]

The file upload control supports onchange event. Hope that can be used to trigger the upload

<form name="upload" action="uploadfile.aspx" method="POST">
    <input name="myfile" type="file" onchange="UploadFile()" />
</form>

<script>
   function UploadFile()
   {
      //do validation here
      document.forms['upload'].submit();
   }
</script>

Solution 2:[2]

ASP:

<input type="file" onchange="this.form.submit();" name="fUpload"/>

CodeBehind:

protected void Page_Load(object sender, EventArgs e)
{
    if (IsPostBack)
    {
        System.Web.HttpPostedFile file = Request.Files["fUpload"];
        if (file != null && file.ContentLength > 0)
        {
            file.SaveAs(@"C:\dir\"+System.IO.Path.GetFileName(file.FileName));
        }
    }

}

asp:FileUpload instead of input:

ASP:

<asp:FileUpload runat="server" onchange="this.form.submit();" ID="fuFile"/>

Codebehind:

protected void Page_Load(object sender, EventArgs e)
{
    if (IsPostBack)
    {
        if (fuFile.PostedFile.FileName != string.Empty  && fuFile.PostedFile.ContentLength > 0)
        {
            fuFile.PostedFile.SaveAs(@"C:\dir\" + fuFile.FileName);
        }
    }

}

Solution 3:[3]

FileUpload does not support any kind of automatically upload a chosen file to the server. You will have to provide some kind of mechanism - see MSDN

Saving Uploaded Files

The FileUpload control does not automatically save a file to the server after the user selects the file to upload. You must explicitly provide a control or mechanism to allow the user to submit the specified file. For example, you can provide a button that the user clicks to upload the file. The code that you write to save the specified file should call the SaveAs method, which saves the contents of a file to a specified path on the server. Typically, the SaveAs method is called in an event-handling method for an event that raises a post back to the server. ...

Solution 4:[4]

I have not use Microsoft.web library but if you can call the java script function Automatically after the file uploded then you can also acheive that.

If you can call the javascript founction in this line :

@Microsoft.Web.Helpers.FileUpload.GetHtml(initialNumberOfFiles: 1, includeFormTag: false, uploadText: "Upload File",allowMoreFilesToBeAdded:false)

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 codingbiz
Solution 2
Solution 3 Pilgerstorfer Franz
Solution 4 Betty