View on GitLab

File Inputs

x-larastrap::file is a Input component with a few peculiar behaviors.

The most important: when included into a Form, it automatically enforces the enctype="multipart/form-data" attribute to the parent Form itself.

<x-larastrap::form>
    <x-larastrap::file label="A File" />
</x-larastrap::form>
<form id="form-576f0efc" class="" method="post" enctype="multipart/form-data" name="form-576f0efc">
  <input type="hidden" name="_token" value="5YbT5gNOd6G389YRp9FtQltihqFg1TlDU1lSt5C2" autocomplete="off">
  <div class="row mb-3">
    <label for="input-7ad48eac" class="col-4 col-form-label">A File</label>
    <div class="col-8">
      <input id="input-7ad48eac" type="file" class="form-control" name="QcYwh7SP3Z" value="">
    </div>
  </div>
  <div class="col-12 text-end">
    <button id="button-fc19b512" class="btn btn-primary" type="submit">Save</button>
  </div>
</form>

multiple

The multiple parameter enforces the multiple HTML attribute to the node, and - if required - handles the node's name as an array to actually permit multiple values.

<x-larastrap::file label="Many Files" name="files" multiple />
<div class="row mb-3">
  <label for="input-ef7140a5" class="col-4 col-form-label">Many Files</label>
  <div class="col-8">
    <input id="input-ef7140a5" type="file" class="form-control" name="files[]" value="" multiple>
  </div>
</div>