^ Zona Info: Atribut tag textarea pada html

Atribut tag textarea pada html

Zona Info | Ilmu Komputer |  Oktober 13, 2017
Post by: Ian

Atribut Pilihan

AtributDeskripsiNilai yang mungkin
name
  • Nama bentuk kontrol, untuk dipasangkan dengan nilainya.
  • Value possible: Teks (tidak ada spasi).
Contoh atribut <textarea name> :

<!DOCTYPE html>
<html>
<body>

<form action="/action_page.php">
<textarea rows="4" cols="50" name="comment">
Enter text here...</textarea>
<input type="submit">
</form>

</body>
</html>


Preview:
maxlength
  • Jumlah maksimum karakter yang diijinkan.
  • Value possible: Jumlah.
Contoh atribut <textarea maxlength> :

<!DOCTYPE html>
<html>
<body>

<textarea rows="4" cols="50" maxlength="50">
Enter text here...</textarea>

<p><strong>Catatan:</strong> Atribut maxlength dari tag textarea tidak didukung di Internet Explorer 9 dan versi sebelumnya, atau di Opera 12 dan versi sebelumnya.</p>

</body>
</html>


Preview: Catatan: Atribut maxlength dari tag textarea tidak didukung di Internet Explorer 9 dan versi sebelumnya, atau di Opera 12 dan versi sebelumnya.
minlength
  • Jumlah minimal karakter yang diijinkan.
  • Value possible: Jumlah.
Contoh atribut <textarea minlength> :


disabled
  • Nonaktifkan kontrol bentuk.
  • Value possible: Tidak ada
Contoh atribut <textarea disabled> :

<!DOCTYPE html>
<html>
<body>

<textarea disabled>
Di blog zona info ini  kita akan saling berbagi pengetahuan tentang segala informasi, berita dan lain-lain. Bukan dari siapa ilmu itu untuk diperebutkan melainkan tentang sejauh mana ilmu itu bermanfaat bagi seluruh umat manusia.
</textarea>

</body>
</html>


Preview:
readonly
  • Membuat bentuk kontrol tidak dapat diubah oleh pengguna.
  • Value possible: Tidak ada
Contoh atribut <textarea readonly> :

<!DOCTYPE html>
<html>
<body>

<textarea rows="4" cols="50" readonly>
Di zona info ini kami paparkan semua tentang bahasa pemrograman tentang dunia website, dengan harapan kita bisa belajar bersama dan mengenalnya seputar tekhnologi.
</textarea>

</body>
</html>


Preview:
autocomplete

Jika browser harus menerapkan pelengkapan otomatis pada kontrol atau tidak.

Value:
on (Default)
off

Contoh atribut <textarea autocomplete> :
<!DOCTYPE html>
<html>
<body>

<form action="/action_page.php" autocomplete="on">

  Nama Depan:<input type="text" name="fname"><br>
  Nama Belakang: <input type="text" name="lname"><br>
  E-mail: <input type="email" name="email" autocomplete="off"><br>
  <input type="submit">
</form>

<p>Isi dan kirimkan formulirnya, lalu muat ulang halaman untuk melihat bagaimana cara kerja pelengkapan otomatis.</p>

<p>Perhatikan bahwa pelengkapan otomatis "pada" untuk formulir, namun "tidak aktif" untuk bidang e-mail.</p>

</body>

</html>

Preview:
Nama Depan:
Nama Belakang:
E-mail:
Isi dan kirimkan formulirnya, lalu muat ulang halaman untuk melihat bagaimana cara kerja pelengkapan otomatis.
Perhatikan bahwa pelengkapan otomatis "pada" untuk formulir, namun "tidak aktif" untuk bidang e-mail.
autofocus
  • Menunjukkan bahwa kontrol formulir harus berfokus pada pemuatan halaman. Sebaiknya hanya digunakan pada satu bentuk kontrol di halaman.
  • Value possible: Tidak ada
Contoh atribut <textarea autofocus> :

<!DOCTYPE html>
<html>
<body>

<textarea rows="4" cols="50" autofocus>
Silakan pelajari tentang bahasa program html yang serasa belum anda pahami.
</textarea>

<p><strong>Catatan:</strong> Atribut autofocus dari tag textarea tidak didukung di Internet Explorer 9 dan versi sebelumnya.</p>

</body>
</html>


Preview: Catatan: Atribut autofocus dari tag textarea tidak didukung di Internet Explorer 9 dan versi sebelumnya.
dirname
  • Menambahkan bidang tambahan yang akan dikirim yang berisi directionality dari nilai kontrol bentuk.
  • Value possible: Teks (tidak ada spasi).

dirname="this.dir"Akan ditambahkan
this.dir=ltr (kiri-ke-kanan) atau
this.dir=rtl (kanan-ke-kiri) ke data yang dikirim, misalnya.

Contoh atribut <textarea dirname> :

<!DOCTYPE html>
<html>
<body>

<form action="/action_page.php">
  Text:<br>
  <textarea name="explanation"dirname="explanation.dir"></textarea>
  <input type="submit" value="Submit">
</form>

<p>Saat formulir diajukan, arah teks dari textarea juga akan diserahkan.</p>

</body>
</html>


Preview:
Text:
Saat formulir diajukan, arah teks dari textarea juga akan diserahkan.

form
  • Secara eksplisit menghubungkan kontrol ke form elemen, yang mungkin atau mungkin tidak disarangkan di dalamnya.
  • Jika absen, kontrol akan dikaitkan dengan form leluhurnya.
  • Teks yang cocok dengan nilai atribut form elemen id.
Contoh atribut <textarea form> :

<!DOCTYPE html>
<html>
<body>

<form action="/action_page.php" id="usrform">
  Nama: <input type="text" name="usrname">
  <input type="submit">
</form>
<br>
<textarea rows="4" cols="50" name="comment" form="usrform">
Enter text here...</textarea>

<p>Area teks di atas berada di luar unsur bentuk, namun tetap harus menjadi bagian dari formulir.</p>

<p><b>Catatan:</b> Atribut bentuk tidak didukung di IE.</p>

</body>
</html>


Preview:
Nama:

Area teks di atas berada di luar unsur bentuk, namun tetap harus menjadi bagian dari formulir.
Catatan: Atribut bentuk tidak didukung di IE.

placeholder
  • Petunjuk yang jelas mengenai jenis data yang harus dimasukkan pengguna.
  • Value possible: Teks.
Contoh atribut <textarea placeholder> :

<!DOCTYPE html>
<html>
<body>

Anda siapa?
<textarea rows="4" cols="50" placeholder="Describe yourself here..."></textarea>

<p><strong>Catatan:</strong> Atribut placeholder dari tag textarea tidak didukung di Internet Explorer 9 dan versi sebelumnya.</p>

</body>
</html>


Preview: Anda siapa? Catatan: Atribut placeholder dari tag textarea tidak didukung di Internet Explorer 9 dan versi sebelumnya.

required
  • Menunjukkan bahwa bidang formulir harus diisi.
  • Value possible: Tidak ada
Contoh atribut <textarea required> :

<!DOCTYPE html>
<html>
<body>

<form action="/action_page.php">
<textarea rows="4" cols="50" name="comment" required>
</textarea>
<input type="submit">
</form>

<p><b>Catatan:</b> Atribut yang dibutuhkan tidak didukung di IE 9 (dan versi sebelumnya), atau di Safari.</p>

</body>
</html>


Preview:
Catatan: Atribut yang dibutuhkan tidak didukung di IE 9 (dan versi sebelumnya), atau di Safari.

rows
  • Jumlah yang diharapkan dari baris yang dibutuhkan
  • Jumlah default adalah 2.
Contoh atribut <textarea rows> :

<!DOCTYPE html>
<html>
<body>

<textarea rows="4" cols="50">
Tekhnologi sudah merambah dunia, pelajari segera agar kita dapat mengikuti laju perkembangan kecanggihannya.
</textarea>

<p>Textarea ini memiliki 4 baris yang terlihat.</p>
<p>Anda dapat mengubahnya dengan mengubah nilai atribut "baris".</p>

</body>
</html>


Preview: Textarea ini memiliki 4 baris yang terlihat.
Anda dapat mengubahnya dengan mengubah nilai atribut "baris".

cols
  • Jumlah karakter yang dibutuhkan dalam satu baris.
  • Jumlah default adalah 20.
Contoh atribut <textarea cols> :

<!DOCTYPE html>
<html>
<body>

<textarea rows="4" cols="50">
Zona info adalah sajian Berita, Informasi, Ilmu Pengetahuan yang dirangkum dan difungsikan untuk pengetahuan manusia.
</textarea>

<p>Textarea ini memiliki 4 baris yang terlihat.</p>
<p>Anda dapat mengubahnya dengan mengubah nilai atribut "baris".</p>

</body>
</html>


Preview: Textarea ini memiliki 4 baris yang terlihat.
Anda dapat mengubahnya dengan mengubah nilai atribut "baris".

wrapJika teks dibungkus saat diserahkan.
  • soft (Default): jangan dibungkus.
  • hard: Harus dibungkus.

Contoh atribut <textarea wrap> :

<!DOCTYPE html>
<html>
<body>

<form action="/action_page.php">

<textarea rows="2" cols="20" name="usrtxt" wrap="hard">
Di sini anda akan mendapatkan tutorial sederhana dan mudah dipahami sekalipun anda seorang pemula.
</textarea>
<input type="submit">
</form>

</body>

</html>

Preview:

No comments:

Post a Comment