Use jQuery to get the file input s selected filename without the path

Question

I used this      input type file    val     to get the file name selected  but it returned the full path  as in  C  fakepath filename doc   The  fakepath  part was actually there - not sure if it s supposed to be  but this is my first time working with the filename of file uploads   How can I just get the file name  filename doc

User · Answer

Here you can call like this Let this is my Input File control

  <input type="file" title="search image" id="file" name="file" onchange="show(this)"  />

Now here is my Jquery which get called once you select the file

<script type="text/javascript">
    function show(input) {
        var fileName = input.files[0].name;
        alert('The file "' + fileName + '" has been selected.');               
            }

</script>

User · Answer

maybe some addition for avoid fakepath   var fileName      input type file    val    var clean fileName split       pop       clean from C  fakepath OR C  fake path  alert  clean file name      fileName

User · Answer

This alternative seems the most appropriate      input type  file     change function e           var fileName   e target files 0  name          alert  The file      fileName       has been selected

User · Answer

Here is how I do it  it works pretty well   In your HTML do    lt input type  file  name  Att AttributeID  onchange  fileSelect event   class  inputField    gt    Then in your js file create a simple function   function fileSelect id  e       console log e target files 0  name       If you re doing multiple files  you should also be able to get the list by looping over this   e target files 0  name

User · Answer

You just need to do the code below  The first  0  is to access the HTML element and second  0  is to access the first file of the file upload  I included a validation in case that there is no file        var filename      input type file    0  files length     input type file    0  files 0  name

User · Answer

Get path work with all OS  var filename      input type file    val   replace                     Example  C  fakepath filename doc   var fakepath filename doc   Both return  filename doc filename doc

User · Answer

lt script type  text javascript  gt           upload   on  change  function              output raw value of file input            filename   html   this  val   replace                                 or  manipulate it further with regex etc          var filename     this  val   replace                                 do your magic              filename   html filename            lt  script gt

User · Answer

How about something like this   var pathArray      input type file    val   split        alert pathArray pathArray length - 1

User · Answer

var filename      input type file    val   split       pop      or you could just do  because it s always C  fakepath that is added for security reasons    var filename      input type file    val   replace  C   fakepath   i

User · Answer

Does it have to be jquery  Or can you just use JavaScript s native yourpath split       to split the string to an array

User · Answer

var filename location href substr location href lastIndexOf      1   alert filename

User · Answer

Chrome returns C  fakepath     for security reasons - a website should not be able to obtain information about your computer such as the path to a file on your computer   To get just the filename portion of a string  you can use split       var file   path split       pop      jsFiddle      or a regular expression     var file   path match                1     jsFiddle      or lastIndexOf       var file   path substr path lastIndexOf         1     jsFiddle

User · Answer

We can also remove it using match  var fileName      input file   val   match             0       file-name   val fileName

User · Answer

Get the first file from the control and then get the name of the file  it will ignore the file path on Chrome  and also will make correction of path for IE browsers  On saving the file  you have to use System io Path GetFileName method to get the file name only for IE browsers    var fileUpload          ContentPlaceHolder1 FileUpload mediaFile   get 0    var files            fileUpload files   var mediafilename         for  var i   0  i  lt  files length  i         mediafilename   files i  name

[javascript] Use jQuery to get the file input's selected filename without the path

Examples related to javascript

Examples related to jquery

Examples related to get

Examples related to filenames