Atribut Form pada HTML - Hirocademy - Education For The Future

Monday, February 5, 2018

Atribut Form pada HTML

Atribut Form pada HTML

Didalam membuat form pada HTML tentu saja akan ada beberapa atribut yang nantinya akan dipergunakan sewaktu dalam memproses data dengan di webserver. berikut inilah beberapa atribut yang nantinya akan dipergunakan pada waktu pembuatan dalam form di HTML.
Namun, padawaktu sebelumnya pernah di bahas tentang bagaimana membuat form pada HTML. Untuk sekarang ini kami akan melanjutkan tutorial dalam pembelajaran HTML Dengan penggunaan atribut pada form HTML. berikut ini akan ada beberapa atribut yang digunakan pada form HTML.

Atribut value, atribut ini merupakan suatu nilai awal yang nantinya akan ditampilkan pada saat menjalankan pada web browser. contohnya 
<!DOCTYPE html>
<html>
<head>
<title>Atribut Form pada html</title>
</head>
<body>
<form>
Username :<input type="text" value="username"><br/>
Nama Lengkap : <input type="text">
</form>
</body>
</html>
Atribut readonly, Kalau kalian menggunakan atribut ini maka pada nilai value tidak bisa di ubah. berikut ini adalah contoh penggunaan readonly pada form HTML
<!DOCTYPE html>
<html>
<head>
<title>Atribut Form pada html</title>
</head>
<body>
<form>
Username :<input type="text" value="username" readonly><br/>
Nama Lengkap : <input type="text">
</form>
</body>
</html>
Atribut disabled, atribut ini akan dipergunakan untuk menonaktifkan berupa inputan. maksudnya  adalah pada elemen disabled bisa digunakan akan tetapi tidak bisa di ganti ataupun di edit.
<!DOCTYPE html>
<html>
<head>
<title>Atribut Form pada html</title>
</head>
<body>
<form>
Username :<input type="text" value="username" disabled><br/>
Nama Lengkap: <input type="text">
</form>
</body>
</html>
Atribut size, atribut ini dipergunakan untuk dapat mengatur lebar kotak inputan, untuk lebih jelasnya silahkan kalian dapat perhatikan contoh berikut ini:
<!DOCTYPE html>
<html>
<head>
<title>Atribut Form pada html</title>
</head>
<body>
<form>
Username :<input type="text" value="username" size="60"><br/>
Nama Lengkap: <input type="text">
</form>
</body>
</html>
Atribut maxlength, atribut ini dipergunakan untuk dapat menentukan jumlah dari inputan teks yang memang telah di batasi. untuk lebih jelasnya perhatikan contoh yang kami berikan berikut ini :
<!DOCTYPE html>
<html>
<head>
<title>Atribut Form pada html</title>
</head>
<body>
<form>
Username :<input type="text" value="username" maxlength="15"><br/>
Nama Langkap : <input type="text">
</form>
</body>
</html> 
Atribut list, atribut ini memang di pertuntukan untuk dapat menampilkan list pada bagian dari form inputan. untuk lebih jelas silahkan kalian langsung saja perhatikan contoh berikut ini :
<!DOCTYPE html>
<html>
<head>
<title>Atribut Form pada html</title>
</head>
<body>
<form>
<input list="kuliah" name="teknik">
<datalist id="kuliah">
<option value="mesin">
<option value="informatika">
<option value="elektro">
</datalist>
</form>
</body>
</html>
Atribut min dan max, Min dan maks pada bagian dari atribut ini akan menentukan nilai minimum dan maksimum untuk elemen dari <input>. Pada atribut min dan maks juga digunakan untuk jenis inputan layaknya seperti : nomor, kisaran, tanggal, datetime, datetime-lokal, bulan, waktu, dan juga berupa hari. perhatikan contoh berikut ini:
<!DOCTYPE html>
<html>
<head>
<title>Atribut Form pada html</title>
</head>
<body>
<form>
<input type="date" name="day" max="1994-12-31">
<input type="date" name="day" min="2018-01-02">
</form>
</body>
</html>
Laceholder Attribute, atribut ini memang dipergunakan untuk pengganti dari pada label field,  perhatikan contoh berikut ini :
<!DOCTYPE html>
<html>
<head>
<title>Atribut Form pada html</title>
</head>
<body>
<form>
<input type="text" name="username" placeholder="namalengkap">
</form>
</body>
</html>
Dengan demikian yang dapat kami sampaikan, Semoga informasi yang kami sampai ini dapat bermanfaat untuk kalian semua. Bagi kalian yang ingin belajar HTML.

No comments:

Post a Comment