Langkah 3 dari 9
Membuat Form Multipart dengan Bootstrap
Form upload wajib memakai enctype="multipart/form-data":
<form method="post"
action="<?= site_url('upload-gambar') ?>"
enctype="multipart/form-data"
id="uploadForm">
<?= csrf_field() ?>
<label for="image" class="drop-zone" id="dropZone">
<img id="preview" class="preview d-none" alt="Preview gambar">
<span id="dropContent">
<strong>Tarik gambar atau klik untuk memilih</strong>
<small>JPG, PNG, WebP · maksimal 2 MB</small>
</span>
</label>
<input id="image" name="image" type="file"
class="visually-hidden"
accept="image/jpeg,image/png,image/webp" required>
<button id="uploadButton" class="btn btn-primary"
type="submit" disabled>Upload Gambar</button>
</form>
Atribut accept membantu file picker menampilkan format yang sesuai, tetapi tidak dianggap sebagai keamanan karena request dapat dibuat tanpa melalui form.
