Get the filename from upload form using Javascript

Submitted by rcastera on Sat, 08/09/2008 - 10:53

Javascript

I needed a way to access the filename of a file being uploaded or attached using the input file from a form. So, I created a nice little function to achieve this. Hopefully it comes in handy for someone.

<script type="text/javascript">
function getNameFromPath(strFilepath) {
    var objRE = new RegExp(/([^\/\\]+)$/);
    var strName = objRE.exec(strFilepath);

    if (strName == null) {
        return null;
    }
    else {
        return strName[0];
    }
}
</script>

11 comments for Get the filename from upload form using Javascript

Hi Richard This looks like...

Posted by Rod Smith on 02/09/2009.

Hi Richard
This looks like the function I require but maybe you can confirm...
I've produced a website for our local camera club and a few of us are uploading our pictures but the ftp process is a bit tricky for some less computerate users.
So I thought I'd use the html file upload on a basic form for them.
Unfortunately when they select a file it only shows the first part of the path and they're not sure it's the correct picture. I'd like to show just the filename, (and extension), below the select field so they can be sure about what they are uploading.
I know I can't check filesizes for them with javascript but could I check that the name fits our layout? Basically I'm telling everyone to call their pictures p1.jpg, p2.jpg etc so they drop into the gallery in the right place.
Many Thanks
ROD

Hey Rod, Sorry it took so...

Posted by Richard Castera on 05/03/2009.

Hey Rod,

Sorry it took so long to reply. Yes this is what you are looking for. It will display the filename of the file they want to upload.

Awesome!...

Posted by Richard Castera on 05/31/2010.

Awesome!

Richard Castera