<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="container"> <form id="fileUploadForm" action="/" enctype="multipart/form-data"> <fieldset> <div class="form-horizontal"> <div class="form-group"> <div class="row"> <label class="control-label col-md-2 text-right" for="filename"><span>File</span></label> <div class="col-md-10"> <div class="input-group"> <input type="hidden" id="filename" name="filename" value=""> <input type="file" id="uploadedFile" name="uploadedFile" class="form-control form-control-sm" accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel"> <div class="input-group-btn"> <input type="submit" value="Upload" class="rounded-0 btn btn-primary"> </div> </div> </div> </div> </div> </div> </fieldset> </form> </div>