Input File di HTML - Referensi HTML

Tidak jarang pengguna kita perlu mengunggah sebuah file dengan berbagai media (file PDF, gambar, audio bahkan video) ke situs yang kita buat. Untuk ini diperlukan input dengan type file

<input type="file" />

Yang menghasilkan

Coba klik tombol ‘Choose File’ di atas, kamu akan bisa memilih file yang ada di komputermu.

Pada saat memilih file, nama file kamu akan muncul.

Membatasi format file

Kita bisa memberi batasan file format apa yang bisa diunggah oleh pengguna situs dengan atribut accept

<input type="file" accept="image/png">

Yang menghasilkan

Sekarang saat memilih, hanya gambar dengan tipe png yang bisa dipilih.

Nilai yang ada pada atribut `accept` adalah nilai 'mime type' dari sebuah media.
Lihat daftar mime type media di sini

Kita juga bisa menerima lebih dari satu jenis format, cukup memisahkannya dengan koma. Contoh:

<input type="file" accept="image/png, image/jpeg">

Memilih lebih dari satu file

Gunakan atribut multiple untuk mengizinkan user memilih lebih dari satu file

<input type="file" multiple>

Yang menghasilkan

Saat memilih file, kamu bisa menekan ctrl atau cmd sambil memilih beberapa file.