file input html code example

Example 1: accept only image files upload html

<input type="file" name="myImage" accept="image/x-png,image/gif,image/jpeg" />

Example 2: input a file in html form

<form action="{% url 'submit' %}" method="POST" enctype="multipart/form-data">
        {% csrf_token %}
  		<div class="mb-3">
            <label for="formFile" class="form-label">Image</label>
            <input class="form-control" type="file" id="formFile" name="image" accept="image/*">
        </div>

        <button class="btn btn-outline-info" type="submit">Submit</button>
</form>

Example 3: input file define type

<input type="file" accept=".gif,.jpg,.jpeg,.png,.doc,.docx">

Example 4: accept vedio pdf files upload html

<input type="file" accept=" video/*" />

Example 5: how to take a file input in html form

<label for="myfile">Select a file:</label>
<input type="file" 
  id="myfile" name="myfile">

Example 6: file type input limit in html

<!-- Right approach: Use both file extensions and corresponding MIME-types. -->
<!-- (IE 10+, Edge (EdgeHTML), Edge (Chromium), Chrome, Firefox) -->
<input type="file"
 accept=".xls,.xlsx, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,application/vnd.ms-excel" />

Tags:

Misc Example