JQuery - File Upload Text (with Bootstrap)

main.js

/**
 * The following block of code is to load all JQuery functions and methods
 *
 *
 *
 */
$(document).ready(function () {
    // load file upload display text function
    fileUpload();
  
    // file upload display text function
    function fileUpload() {
        $('input[type=file]').on('change',function(){
            // get the filename
            var fileName = $(this).val();
            // this trim is meant to be robust for all web clients,
            // trimming full path and only show file itself
            // for e.g. remove C:\fakepath\ and keep <filename>.<extension>            
            fileName = fileName.substring(fileName.lastIndexOf("\\") + 1, fileName.length);
            // finally, replace the "Choose a file" label
            // .custom-file-label is a bootstrap class (example class)
            $(this).next('.custom-file-label').html(fileName);
        })
    }

});