<form>
  <div class="custom-file-upload-wrapper">
    <label for="file-upload" class="ui-btn custom-file-upload">
    Choose File: No file chosen
    </label>
    <input id="file-upload" name='upload_cont_img' type="file" style="display:none;">
  </div>
</form>
.custom-file-upload {
  border: 1px solid #ccc;
  display: inline-block;
  padding: 6px 12px;
  cursor: pointer;
}
$(document).ready(function(){
      $('#file-upload').change(function() {
        var file = $('#file-upload')[0].files[0].name;
        $(this).closest('.custom-file-upload-wrapper').find('label').text('Selected File: ' + file);
      });
    });

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js