Whenever the uploading process happens through the Browsers rather than IE, the path
belongs to the file from client side systems is showing like "c:/fakepath/x.jpg"..! I tried out lot of
Solutions from the web to rectify that, but nothing works..! If anybody successfully tackled this
problem before Just send me your solution..!
HTML code that i used

<form name="xx"  enctype="multipart/form-data">
<input type="file" name="up"/>
</form>

My Java script..

alert(document.xx.up.value);

But it is displaying "c:/fakepath/x.jpg" in all browsers except IE.

Whenever the uploading process happens through the Browsers rather than IE, the path
belongs to the file from client side systems is showing like "c:/fakepath/x.jpg"..! I tried out lot of
Solutions from the web to rectify that, but nothing works..! If anybody successfully tackled this
problem before Just send me your solution..!
HTML code that i used

<form name="xx"  enctype="multipart/form-data">
<input type="file" name="up"/>
</form>

My Java script..

alert(document.xx.up.value);

But it is displaying "c:/fakepath/x.jpg" in all browsers except IE.

• javascript
• html
• file-upload

Share Improve this question Follow edited Feb 28, 2012 at 5:18 Michael Fredrickson 37.4k66 gold badges9595 silver badges110110 bronze badges asked Feb 28, 2012 at 4:36 Rajaprabhu AravindasamyRajaprabhu Aravindasamy 67.2k1717 gold badges106106 silver badges132132 bronze badges

Add a ment  | 

5 Answers 5

Sorted by: Reset to default 1

This is a browser security restriction. You can't set the value of the file upload control via script, nor can you read the correct path.

Modern browsers won't tell you what the actual path of the file is, because it's really none of your business as an application programmer, and is likely to contain private user information (e.g, their username).

There is no workaround. Learn to live without that information.

This post shows a way to remove the 'fakepath' display:

// Change the node's value by removing the fake path

inputNode.value = fileInput.value.replace("C:\fakepath\", "");

Change the ClientId of the AsyncFileUpload control from Inherit to AutoId

Adding some few more steps to your code and introducing a change event, you could retrieve the file object from the event target if there is a file selected at all.

<form name="xx"  enctype="multipart/form-data">
    <input type="file" onchange="fileChangeAction(event)" name="up"/>
</form>

<script>
    const fileChangeAction = ($event) => {
        let file;
        if($event.target) {
            if($event.target.files) {
                file = $event.target.files[0];
            }
        }
        console.log(file);
    }
</script>