Pada kesempatan kali ini saya akan menjelaskan cara menggunakan attribute pattern di input html. Perlu teman-teman ketahui sebelumnya, atribute pattern bisa teman-teman gunakan untuk memproteksi khusus dari jenis inputan yang ditentukan. Sebagai contoh, jika saya ingin membuat input type password yang berisi 6 atau lebih karakter maka saya bisa menggunakan attribute pattern tersebut. Dari attribute pattern yang bisa digunakan tersebut, tentunya lebih memudahkan teman-teman untuk memproteksi inputan khusus suatu komponen di html. Mungkin sebagian teman-teman sudah mengetahui bagaimana cara memproteksi atau membatasi suatu inputan khusus beserta karakter yang sudah ditentukan dengan javascript, namun pada penjelasan disini, saya akan memberikan contoh cara menggunakan attribute pattern di input html, dan teman-teman bisa ikuti saya.

Dari attribute tersebut dapat mendukung beberapa peramban browser seperti :

  1. Mozila Firefox versi 4.0.
  2. Google Chrome versi 5.0.
  3. Internet Explorer versi 10.0.
  4. Opera versi 9.6.
  5. dll.

Berikut Contohnya :

<input> elemen dengan type=”password” yang harus berisi 5 atau lebih karakter :

<input> elemen dengan type=”password” yang harus terdiri 8 atau lebih karakter yang setidaknya mengandung satu angka dan satu huruf besar dan huruf kecil :

Dari contoh diatas bisa teman-teman lihat, dan untuk penggunaan attribute pattern tersebut teman-teman cukup menyertakan attribute <pattern> pada suatu komponen input dan di ikuti dengan <title> untuk pesan dari kesalahan nya.

Namun perlu teman-teman ketahui, untuk penggunaan pattern atribute dalam menentukan ekspresi reguler, tersebut hanya mendukung jenis komponen seperti berikut :

  1. atribute pattern hanya bekerja dengan jenis masukan input type dengan text
  2. atribute pattern hanya bekerja dengan jenis masukan input type dengan date
  3. atribute pattern hanya bekerja dengan jenis masukan input type dengan search
  4. atribute pattern hanya bekerja dengan jenis masukan input type dengan url
  5. atribute pattern hanya bekerja dengan jenis masukan input type dengan tel
  6. atribute pattern hanya bekerja dengan jenis masukan input type dengan email
  7. atribute pattern hanya bekerja dengan jenis masukan input type dengan password

Sampai disini penjelasan saya mengenai cara menggunakan attribute pattern di input html, semoga bermanfaat.