ITWorker ITWorker - 25 days ago 9
HTML Question

MVC: How to get full file path from file input field?

I have the following razor code:

<div class="container">
@Html.ValidationSummary(false)
@using (Html.BeginForm("EncryptFile", "Encryption", new { returnUrl = Request.Url.AbsoluteUri }, FormMethod.Post, new { @id = "encryptionform", @class = "form-horizontal" }))
{

<div class="form-group">
@Html.Label("File", new { @class = "control-label col-md-2" })
<div class="col-md-10">
<input type="file" id="encryptfilefield" name="uploadedfile" enctype='multipart/form-data'/>
</div>
</div>


<button type="submit" id="encryptfilebutton">Encrypt</button>
<button id="decryptfilebutton" type="button">Decrypt</button>
<button id="reencryptfilebutton" type="button">Re-Encrypt</button>

}
</div>


and the following controller code gets called when I click the Encrypt button:

[HttpPost]
public ActionResult EncryptFile(string uploadedfile)
{
/*process the file without uploading*/
return Json(new { status = "success", message = "Encrypted!" });
}


I am able to hit this action when I click the encrypt button, but the
uploadedfile
string always comes in as
null
. How can I get the fill filepath of the file that was selected? Please note that I am not trying to upload it to the server (despite "uploaded" appearing in the name), I just need the filepath.

EDIT

I saw in IE 11 that the following showed the file path fully (the part inside the alert):

alert($("#encryptfilefield").val());


However this is not a full solution, and it seems there is no solution due to to it being a security issue.
Thank you.

Answer

Updated Answer

Unfortunately there's no way to get that info consistently among all browsers., there's multiple posts on here about this topic and the conclusion is browsers don't allow it for security purposes.

I did find that in IE 11 they do include the path within the input dom element .value property, but I don't know if that works in other versions, and it does not work in chrome.

$('input[type=file]').change(function () {
   console.dir(this.value);
   console.dir(this.files[0])
})

Unfortunately that's about the best you can expect. Here's a post that has a couple things you could do to possibly achieve some very specific scenarios.

How to get full path of selected file on change of <input type=‘file’> using javascript, jquery-ajax?

Original Answer (how to get file path "After" it reaches server)

The null param issue I'm thinking is because MVC binds on element name property.

 <input type="file" id="encryptfilefield" name="uploadedfile" enctype='multipart/form-data'/>

and your controller action is marked as type string, which is not what your input type is.

you could either change that to this,

[HttpPost]
public ActionResult EncryptFile(HttpPostedFileBase uploadedfile)
{

or try grabbing the file straight from the Request object like below, you'd have to save it somewhere before you get the full path of it though, i don't believe you'll get the filepath of where it originated from, only after you save it.

[HttpPost]
public ActionResult EncryptFile(string uploadedfile)
{

    HttpPostedFileBase myfile = Request.Files[0];

    if (file.ContentLength > 0) 
    {
        // extract only the fielname
        var fileName = Path.GetFileName(file.FileName);
        // store the file inside ~/App_Data/uploads folder
        var path = Path.Combine(Server.MapPath("~/App_Data/uploads"),fileName);
       file.SaveAs(path);
     }

      /*process the file without uploading*/
      return Json(new { status = "success", message = "Encrypted!" });
}