San Francisco Design System

File upload field 

<form>
    <div class="form-group field-m13" data-id="upload_plans">
        <label>
      <span class="label">Upload a PDF of your plans</span>
      <input id="upload_plans" data-formtype="m13" name="upload_plans" type="file" required="" data-required-error="You need to upload a file.">
      <span class="file-custom" data-filename=""></span>
    </label>
        <div class="help-block with-errors"></div>
    </div>
</form>
 
<form>
  <div class="form-group field-m13" data-id="{{ id }}">
    <label>
      <span class="label">{{ title }}</span>
      <input id="{{ id }}" data-formtype="m13" name="{{ id }}" type="file" required="" data-required-error="You need to upload a file.">
      <span class="file-custom" data-filename=""></span>
    </label>
    <div class="help-block with-errors"></div>
  </div>
</form>
 
{
  "title": "Upload a PDF of your plans",
  "id": "upload_plans"
}
  • Handle: @file-field
  • Preview:
  • Filesystem Path: src/components/04-forms/field-types/file-field/file-field.html

There are no notes for this item.