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

1//Use lastIndexOf to get the last \ as an index and use substr to get the remaining string starting from the last index of \
2
3function getFile(filePath) {
4        return filePath.substr(filePath.lastIndexOf('\\') + 1).split('.')[0];
5    }
6
7    function getoutput() {
8        outputfile.value = getFile(inputfile.value);
9        extension.value = inputfile.value.split('.')[1];
10    }
11<input id='inputfile' type='file' name='inputfile' onChange='getoutput()'><br>
12    Output Filename <input id='outputfile' type='text' name='outputfile'><br>
13    Extension <input id='extension' type='text' name='extension'>

1//Use lastIndexOf to get the last \ as an index and use substr to get the remaining string starting from the last index of \
2
3
4function getFileNameWithExt(event) {
5
6  if (!event || !event.target || !event.target.files || event.target.files.length === 0) {
7    return;
8  }
9
10  const name = event.target.files[0].name;
11  const lastDot = name.lastIndexOf('.');
12
13  const fileName = name.substring(0, lastDot);
14  const ext = name.substring(lastDot + 1);
15
16  outputfile.value = fileName;
17  extension.value = ext;
18  
19}
20<input id='inputfile' type='file' name='inputfile' onChange='getFileNameWithExt(event)'><br>
21  Output Filename <input id='outputfile' type='text' name='outputfile'><br>
22  Extension <input id='extension' type='text' name='extension'>

1var fu1 = document.getElementById("FileUpload1");
2alert("You selected " + fu1.value);