Sabtu, 07 Juli 2012

Helper Form: form_label()

Jika kita membuat form untuk input, maka kita akan memberikan teks atau prompt di sebelah kiri atau di atas dari elemen inputnya. Teks atau prompt ini digunakan untuk memberikan keterangan kepada pengguna aplikasi tentang data apa yang harus dimasukkan ke dalam elemen input yang disajikan tersebut.

Bentuk form entri secara umum:

Login
Nama user : |___________|
Password   : |___________|

|Login| |Cancel|


Kita bisa menggunakan elemen tabel agar tampilannya lebih rapi atau menggunakan CSS untuk mengatur letak dari elemen input.

Kita dapat menggunakan CSS untuk dapat merapikan tampilan, sehingga antara prompt dan elemen input dapat ditampilkan berdampingan seperti menggunakan tabel, atau pun berbeda baris.

Untuk menampilkan prompt untuk suatu elemen, maka prompt ditampilkan dengan menggunakan teks biasa.

Jika kita melihat pada pemrograman di lingkungan dengan antarmuka grafikal, maka kita sering disediakan fitur, jika kita klik promptnya, maka kita akan mendapatkan kursor kita pada elemen input. Fitur mengklik pada prompt atau pun nilai dari suatu pilihan itu sama dengan mengklik pada elemen inputnya; sehingga pengguna bisa lebih dimudahkan.

Elemen form HTML pun telah dilengkapi untuk memudahkan pengguna bisa mengklik prompt atau nilainya saja, tidak perlu mengklik elemen inputnya untuk bisa membuat kursor fokus pada elemen inputnya.

Elemen HTML yang digunakan untuk membuat kemudahan ini adalah elemen label, dengan tag <label> Teks </label>.

Contoh:

<label for="idelemeninput">Teks/Prompt</label>
<input type="text"  id="idelemen"  name="idelemen" value="">


Tag label jika ingin dapat berfungsi untuk memudahkan pemfokusan kepada elemen input, maka tag label selalu dipasangkan dengan elemen inputnya. Di dalam tag label kita harus menambahkan atribut for yang diisi dengan idelemen yang akan diberi fokus, jika teks atau prompt dari label diklik.


Jika kita menggunakan CodeIgniter, maka kita dapat dengan mudah untuk menyatakan label untuk suatu elemen input.


Untuk contoh di atas, maka kita dapat menyatakan dengan cara berikut:


<?php
echo form_label("Teks/Prompt","idelemen");
echo form_input("idelemen");
?>

Elemen atau tag label ini jarang digunakan oleh pemrogram aplikasi web, apalagi jika pemrogram lebih banyak menggunakan tabel untuk membuat layout dari form entrinya.

Tidak ada komentar:

Posting Komentar