Logo Komodo Koding /Koding

Input text di HTML

Menerima masukan data tulisan atau text bisa dengan input text dari HTML

Untuk menerima sebuah input tulisan (text), gunakan tag <input> dengan type text

Contoh input text

<input type='text'>

Yang menghasilkan

Coba klik kotaknya 👆🏼 dan ketik sesuatu.

Nilai contoh dengan atribut placeholder

Kita bisa memberi petunjuk atau contoh dari isian textnya, dengan atribut placeholder

<input type='text' placeholder='contoh isian'>

Yang menghasilkan

Nilai default dengan atribut value

Kita bisa memberi nilai otomatis dari isian textnya, dengan atribut value

<input type='text' value='otomatis!'>

Yang menghasilkan

Mengatur panjang input text

Panjang dari input bisa disesuaikan dari berapa karakter yang ingin dimasukkan dengan menggunakan atribut size. Sebagai contoh saya ingin memberi ukuran 5 karater.

<input type='text' size='5'>

Yang menghasilkan

*Perhatikan panjang dari input text kita kali ini berubah.

Memberi batas maksimal input text

Jika dengan atribut size mengatur tampilan kotaknya, kali ini kita bisa membatasi berapa maksimal karakter yang dimasukkan dengan atribut maxlength.

<input type='text' maxlength='5'>

Yang menghasilkan

*Coba masukkan lebih dari 5 karakter!

Memberi batas minimal input text

Jika dengan atribut size mengatur tampilan kotaknya, kali ini kita bisa membatasi berapa minimal karakter yang dimasukkan dengan atribut minlength.

<input type='text' minlength='3'>

Yang menghasilkan

Jika kamu coba memasukkan kurang dari 3 karakter dan tekan tombol submit, maka akan muncul sebuah warning (pengingat).