Membuat input type text hanya boleh berisi angka dengan HTML5

html5 - web design murah - input type hanya boleh angka

jasa web design murah dengan tutorial html5 input type dibatasi hanya angka saja



Membuat input type text hanya boleh berisi angka dengan HTML5

Bagaimana membuat input text supaya hanya boleh berisi angka saja? Tidak perlu menggunakan javascript, karena dengan menggunakan HTML5 kita bisa membuatnya dengan mudah.

Anggap saja kita ingin membuat kolom untuk menginputkan temperatur badan seseorang dengan aturan suhu yang boleh diinputkan minimal 30o dan maksimal 50o, ditambah lagi dimungkinkan untuk memasukkan sebanyak satu angka decimal.
Contohnya: 30.1o.

Baca Juga: Penggunaan Bootstrap-DateTimePicker untuk range tanggal

Dengan kebutuhan seperti itu, kita bisa membuatnya menggunakan HTML5 dengan kode sebagai berikut:

<input id="temperature" class="form-control" max="50" maxlength="4" min="30" name="temperature" size="50" step="0.1" type="number" />

type="number" digunakan sebagai indikator bahwa input data hanya boleh angka.
step="0.1" artinya kenaikan atau pengurangan angka jika tanda up/down diklik.
min="30" max="50" adalah angka minimal dan maksimal yang boleh diinputkan supaya form bisa disubmit.

Dan hasil jadi dari contoh di atas adalah:

DEMO

Baca Juga: Penggunaan Bootstrap-DateTimePicker untuk range tanggal

Selamat mencoba.



Artikel Lainnya

Web Design Surabaya - Web Design Murah - Jasa SEO terbaik

Tips Sukses Learn MySQL Bagi Pemula untuk Menjadi Data Scientist

Ketertarikan orang-orang untuk bekerja sebagai seorang data scientist perusahaan, dari hari ke hari terbilang cukup tinggi. Apabila Anda ingin menjalani profesi tersebut, maka diharuskan untuk memiliki skill learn MySQL terlebih dahulu. Hal ini dikar ...


Tips Sukses Belajar MySQL, Pemula Jangan Cepat Menyerah

Salah satu DBMS atau Database Management System yang umum digunakan adalah MySQL. Sesuai dengan namanya, sistem ini menggunakan bahasa SQL yang merupakan kependekan dari Structured Query Language. Belajar SQL bukanlah hal yang mudah namun bisa dipela ...


Simak, Ini Tips Sukses Optimasi JavaScript Yang Lambat

Dalam proses belajar JavaScript, Anda mungkin melewatkan beberapa aspek. Misalnya dalam penerapan strategi optimasi JavaScript yang membuat pemuatan website menjadi lambat. Padahal kecepatan sebuah situs web sangat berpengaruh pada upaya pengoptimala ...


Proses Pengerjaan

Web Design - Photography (foto prewedding casual, foto prewedding unik, photo pre wedding) - Videography

Lokasi di Surabaya dan Bali

Foto Buat Nikah

Desain Grafis

Kontak

08113638531 / 08113865464

info@tatamedia.com

Desainer Website di Surabaya

Web Design di Bali

Kantor

Tatamedia Solusindo Surabaya

Dekkophotography Bali

Video Prewedding

Web Design

Support

Kirim permintaan anda ke

info@tatamedia.com