Sponsor Ads   X  
Sponsor Ads   X  

19/04/2010

MENGENAL TAG INPUT

Tag <input>

Tag <input> menentukan bentuk field bidang input yang akan ditampilkan dalam sebuah formulir. Dan dalam penggunaanya, tag <input> ini tidak mengharuskan tag pembuka dan penutupnya secara terpisah, <input> dan </input>. Cukup dengan satu elemen yang merupakan pembuka sekaligus penutupnya, yaitu dengan memberi tanda slash (/) di akhir sebelum tanda (>), sehingga menjadi <input/>.

Beberapa atribut untuk tag input antara lain:

type
Untuk menentukan tampilan bidang input. Nilai yang dapat digunakan antara lain adalah:
  • "text" (standar) =>
  • "checkbox" =>contoh
  • "radio" => contoh.
  • "password" =>
  • "submit" =>
  • "file" =>
  • "image".
name
Berfungsi untuk mengidentifikasi formulir pada saat setelah dikirim ke server. Atribut ini tidak mempengaruhi pada tampilan, nilai yang digunakan adalah bisa di isi apapun.

value

Untuk memberikan nilai pada type input terkait. Nilainya adalah bisa diisi apapun.

size

Untuk menentukan lebar bidang. Nilai yang diperlukan adalah, "di isi angka"

maxlength

Untuk menentukan jumlah maksimal karakater yang dapat dimaksukan. Atribut ini hanya untuk disertakan pada type "text" atau "password"

disabled

Berfungsi untuk menon-aktifkan bidang input dalam kondisi tertentu. Nilai yang digunakan adalah "disabled"

checked

Untuk menentukan pilihan standar yang tampilkan pada saat browser dibuka. Atribut ini untuk disertakan pada input type "checkbox" dan "radio".
Nilai yang digunakan adalah "checked".

src

Untuk menentukan lokasi gambar yang digunakan sebagai tombol submit. Dan tentunya, atribut ini untuk disertakan pada input type "image".
Nilai yang digunakan adalah, "Diisi URL".

Berikut ini adalah beberapa contoh, bagaimana cara kerja tag <input/> dengan menggunakan atribut type dalam membuat sebuah formulir.

TEXT&PASSWORD
Jika ditulis:
<form>
Pengguna:<br/>
<input type="text"/><br/>
Sandi:<br/>
<input type="password"/><br/>
<input type="submit" value="Masuk"/>

Hasilnya adalah:
Pengguna:

Sandi:


Pada contoh diatas, lihat dan perhatikan juga bagaimana cara kerja <input type="submit" value="Kirim"/>.




CHECKBOX
Memungkinkan pengguna untuk menentukan pilihan dengan tanda centang.
Jika ditulis:
<form>
<input type="checkbox" name="Senin"/>Senin
<input type="checkbox" name="Selasa"/>Selasa
<input type="checkbox" name="Rabu"/>Rabu
<input type="checkbox" name="Kamis"/>Kamis
<input type="checkbox" name="Jumat"/>Jumat
<input type="checkbox" name="Sabtu"/>Sabtu
<input type="checkbox" name="Minggu"/>Minggu
<input type="submit" value="Kirim"/></form>
Hasilnya adalah:
Senin
Selasa
Rabu
Kamis
Jumat
Sabtu
Minggu


RADIO
Jika ditulis:
<form>
<input type="radio" name="Senin"/>Senin
<input type="radio" name="Selasa"/>Selasa
<input type="radio" name="Rabu"/>Rabu
<input type="radio" name="Kamis"/>Kamis
<input type="radio" name="Jumat"/>Jumat
<input type="radio" name="Sabtu"/>Sabtu
<input type="radio" name="Minggu"/>Minggu
Hasilnya adalah:
Senin
Selasa
Rabu
Kamis
Jumat
Sabtu
Minggu


FILE&SUBMIT
Jika ditulis:
<form>
<input type="file"/>
<input type="submit" value="upload"/>
</form>
Hasilnya adalah:


IMAGE
Jika ditulis:
<form>
Pengguna:<br/>
<input type="text"/><br/>
Sandi:<br/>
<input type="password"/><br/>
<input type="image" src="http://i676.photobucket.com/albums/vv122/sung_sun6/submit.jpg"/>

Hasilnya adalah:
Pengguna:

Sandi:



Sebelumnya | Berikutnya

Silahkan baca juga yang ini:

0 comments:

Tinggalkan Komentar Anda

Terimakasih telah berkunjung, untuk kritik, saran, ataupun pertanyaan, silahkan berikan komentar anda disini:

 
Halaman Muka | Tentang | Kontak | Sitemap | 2008- © kakangsung All Rights Reserved