/Javascript/Bootstrap/Choose file bootstrap show filename

Choose file bootstrap show filename

Bootstrap input file

<div class="custom-file">
 <input type="file"  class="custom-file-input" id="inputGroupFile01">
<label class="custom-file-label" for="inputGroupFile01">Choose file</label>
</div>

Input file type bootstrap

<div class="mb-3">
  <label for="formFileSm" class="form-label">Small file input example</label>
  <input class="form-control form-control-sm" id="formFileSm" type="file">
</div>

Source: getbootstrap.com

Choose file bootstrap show filename

document.querySelector('.custom-file-input').addEventListener('change',function(e){
  var fileName = document.getElementById("myInput").files[0].name;
  var nextSibling = e.target.nextElementSibling
  nextSibling.innerText = fileName
})

Source: stackoverflow.com

Similar codes

14 votes316 views6 answers
Bootstrap image size
CSS Bootstrap
1 vote386 views1 answer
Bootstrap 4 modal popup remote url
Javascript Bootstrap
92 votes366 views5 answers
Bootstrap primary color code
CSS Bootstrap
6 votes302 views3 answers
.row bootstrap
CSS Bootstrap
0 vote375 views1 answer
Bootstrap put button on one line
CSS Bootstrap
0 vote319 views1 answer
React bootstrap make col disapear in small screens
Javascript Bootstrap
222 votes478 views6 answers
Bootstrap CSS CDN
CSS Bootstrap
0 vote324 views1 answer
How to remove the top border from table react bootstrap
Javascript Bootstrap
120 votes397 views3 answers
React import bootstrap css file
CSS Bootstrap
64 votes385 views4 answers
Bootstrap buttons
CSS Bootstrap