Demo showing fileinput dishonors basic configuration when used in BS modal

Irrespective of whether the config is passed during initialization or as data attribs, they are not honored when the input is loaded in a BS modal.

by Sree K

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-fileinput/4.4.3/css/fileinput.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-fileinput/4.4.3/js/fileinput.min.js"></script>
<!-- Button trigger modal -->
<button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">
  Launch modal
</button>

<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel">Modal title</h4>
      </div>
      <div class="modal-body">
            <label for="input-b1">Select File</label>
            <input id="input-b1" name="input-b1" type="file" class="file">
      </div>
    </div>
  </div>
</div>

JavaScript

$('#input-b1').fileinput({
  showPreview: false,
  showRemove:false,
  uploadUrl: function() {
    return $(this).closest(\'form\').attr(\'action\');
  },
  maxFileSize: 10240,
  msgValidationError: "File Upload Error - Max. allowed size is 10MB",
});