Mengenal Dan Membuat Form Input Data, Text, Number, Dan Password

Tanggal : 01 Sep 2018, Category : HTML, Create By : admin

Selamat datang kembali di website gudang ilmu aplikasi, kali ini kami akan membahas mengenai cara membuat form input data text, form input data number dan form input data password. Form dalam bahasa html bisa di artikan sebagai formulir pengisian data, yang nantinya akan diisi oleh pengunjung atau penguna. Biasanya di gunakan untuk input data atau membuat form login. Mari kita bahas satu persatu.

Membuat Form Input Text

Untuk input yang pertama adalah penginputan data text, data yang bisa di inputkan di isi tidak hanya data text anda juga bisa menginputkan data number (angka) dan simbol. berikut contoh scriptnya

<input type="text" name="dataText" id="dataText" value="" />

Dalam pembuatan form input anda di haruskan memberi nama untuk masing - masing form, untuk attribut name nantinya untuk penamaan pengiriman data $_POST ketika submit, sedangkan attribut id biasanya di gunakan untuk pengambilan data menggunakan JavaScript, sedangkan atribut value adalah isi default input data, jika tidak ada default anda bisa mengkosongkan atau tidak usah menggunakan atribut value. Berikut hasilnya jika di jalankan di browser.

Membuat Form Input Number atau Angka

Selanjutnya adalah cara membuat form input data angka, data yang bisa inputkan hanyalah number tetapi anda juga bisa menginputkan bilangan -bilangan desimal untuk pemisahnya bisa menggunakan titik (.) dan koma (,) dan bisa menggunakan simbol min (-) untuk bilangan negatif. Berikut scriptnya

<input type="number" name="dataNumber" id="dataNumber" value="" />

Untuk penggunaan attributnya sama persis seprti kita menggunakan form input text, cuma tinggal mengganti type dari form tersebut. Berikut hasilnya

Membuat Form Input Password atau Kata Sandi

Selanjutnya afalah cara membuat form input kata sandi atau password. data yang bisa di input sama seperti penggunaan form input text, anda bisa menggunakan text, angka dan simbol, hanya saja ketika anda menginput data, data tersebut akan terlihat seperti titik - titik hitam yang tidak di ketahui isi input datany. Berikut Scriptnya

<input type="password" name="dataPassword" id="dataPassword" value="" />

Untuk penggunaan atribut sama seperti form text dan form angka, hanya perubahan di sisi type, berikut hasinya.

Hasil dari form password seperti gambar di atas, fungsinya sendiri adalah merahasiskan data yang di input karena password adalah data rahasia yang di simpan oleh masing - masing pengguna, form ini bisanya di gunakan pendaftran member dan ketika login.

Dari keritga form input data di atas ada tag html yang sangat penting untuk penunjang form input data yaitu tag form itu sendiri, form sendiri berfungsi untuk blok pembuka dan tutup dari semua tag input form. untuk lebih lanjut anda bisa klik disini membuat formulir input data

Mungkin hanya itu yang bisa saya sampaikan jika ada pertanyaan silahkan isi kolom komentar di bawah. Terimakasih.


Keyword:
  • membuat form input text
  • membuat form input data text
  • membuat form input angka
  • membuat form input data angka
  • membuat form input password
  • membuat form input data password
  • membuat form input number
  • membuat form input data number
  • form text
  • form number

Artikel Lain

Javascript Const And How To Use It

Date : 15 Feb 2023, Category : JavaScript, Create By : admin

In JavaScript, const is a keyword used to declare a constant variable that cannot be reassigned a new value once it has been initialized. Here's how to use it: const pi .....

Memahami Array Pada Bahasa Pemprograman Php

Date : 11 Sep 2018, Category : Pemprograman Website, Create By : admin

Selamat datang kembali di wesbite gudang ilmu aplikasi, kali ini kami akan membahas mengenai array pada pemprograman php, array dalam pembuatan aplikasi sangat sering di gunakan baik, array yang sederhana .....

Html Paragraphs And How To Use Them

Date : 15 Feb 2023, Category : HTML, Create By : admin

HTML paragraphs are used to display blocks of text on a web page. Here's how to use them: To create a paragraph, use the <p> tag, like this:  <p>This is a paragraph .....