get filename of input file javascript code example

Example 1: javascript - get the filename and extension from input type=file

//Use lastIndexOf to get the last \ as an index and use substr to get the remaining string starting from the last index of \

function getFile(filePath) {
        return filePath.substr(filePath.lastIndexOf('\\') + 1).split('.')[0];
    }

    function getoutput() {
        outputfile.value = getFile(inputfile.value);
        extension.value = inputfile.value.split('.')[1];
    }
<input id='inputfile' type='file' name='inputfile' onChange='getoutput()'><br>
    Output Filename <input id='outputfile' type='text' name='outputfile'><br>
    Extension <input id='extension' type='text' name='extension'>

Example 2: get uploaded file name in js

$('input[type="file"]').change(function(e) {
        var fileName = e.target.files[0].name;
        $(e.target).parent('div').find('.form-file-text').html(fileName)
  		// Inside find search element where the name should display (by Id Or Class)
});