HTML’de Form Kullanımı

Formları site ziyaretçileri veya kullanıcılarından bilgi alma ve bunları işleme amaçlı kullanırız. Form ile düz metin, şifre ve seçim kutuları gibi nesneler oluşturarak, istediğimiz türde bilgiyi alırız.

Bir form alanı <form> ile başlar ve</form> ile biter. Bu konu varolma bakımından tek başına işlenemez. Ben PHP kullandığım için bazı PHP öğelerini de bu konunun içinde göreceksiniz.

Formları HTML ile işleyemeyeceğimiz için PHP gibi Server-Side bir dil kullanmamız gerekir. Şimdi tek tek form nesnelerini tanıyalım.

Form Giriş (input)

Şimdi en çok kullanılan form etiketi <input> u tanıyacağız.

Metin / Yazı Alanları

Bunu güzel bir örnekle öğrenelim;

Bu örnekle çoğu şeyi öğreniyoruz.

• form name=”form” — Form için belirlediğiniz isimdir. Türkçe karakter kullanmamaya özen gösterin.
• action=”index.php” — Formdan alınan bilgilerin nerede işlem göreceğini belirtir.
• method=”post” — Formun hangi yöntemle gönderileceği yazmaktadır. PHP gibi dillerde POST ve GET bulunmaktadır. POST olursa bilgiler görünmez, GET olursa form nesnelerine göre dinamik şekilde adreste görünür.
• type=”tür” — İnput’un türünü belirtir. Örnekte text ile düz metin, password ile şifre kutusu, submit ile formu gönderme butonu olduğunu belirttik.
• size=”boyut” — Form nesnesinin uzunluğunu belirtir. Sadece text ve password type’ında kullanılır.
• input name=”kullaniciisim” — Forma isim verdiğimiz gibi nesnelere de isim vermeliyiz. Türkçe karakter kullanmamaya özen gösterin. Yoksa form öğelerinizde sorun oluşabilir. Bilgileri gönderdiğimiz dosyadan veriyi alırken buradaki ismi kullanırız.
• value=”deger” — Metin kutusunda veya butonda yazacak yazıyı buradan belirleriz.

TextArea Kullanımı

Bazı durumlarda kullanıcıdan uzun bir bilgi almamız gerekebilir. Bunun için <textarea>…</textarea> kodunu kullanırız.

Burada cols=”sutun sayısı” Sütun sayısını; rows=”satır sayısı” Satır sayısını belirtir.

Seçenek Butonu (Radio Buttons)

Form’a gelen kullanıcının bir çok seçenek içinden bir tanesini seçmesini istediğimiz durumlarda radio butonları kullanılır.

Kontrol Kutuları (Checkboxes)

Form’a gelen kullanıcının sunulan seçenekler içerisinden istediği kadarını seçmesini sağlamak için kullanılır. Örneğin kullanıcının ilgilendiği yazı kategorilerini böylece seçtirebiliriz.

Açılır Seçim Kutusu

Form’a seçim kutusu eklemenin bir yolu da <select> kodudur. Kullanımını bir örnekle görelim;

Bu Örnekte value=”” ile belirtilen değer form için bilgi, option kodları arasına yazdığımız Kategoriler ise seçim kutusunda kullanıcıya görünen kısımdır. Seçim Kutumuzun ismini select komutunun içinde name=”kategori” şeklinde belirleriz.

Websitelerinde ziyaretçi veya üyelerden bilgi almak için Formlar kullanılır. PHP veya ASP gibi diller yardımıyla alınan bu bilgilerle ise bir çok işlem yapılabilir.

Formlarla yapılabileceklere örnek vermek gerekirse; giriş formları, e-mail gönderme formları, hesaplama formları, yönetim panelleri örnek gösterilebilir.

Formlar <form></form> etiketleri arasına yazılır.

Girilen bilgilerin hangi adrese gideceği action özelliği ile belirtilir. Bu bilgilerin gönderilme yöntemini de method özelliği ile belirlenir. Method özelliği GET veya POST değerlerinden birini alır.

HTML Form Yapımı ve Kullanımı

PHP’ye verileri göndermek için bir arayüz oluşturmamız gerekir. HTML’in Form etiketiyle bir arayüz oluşturabiliriz.

<form action="Formun gönderileceği / işleneceği sayfa" method="form veri gönderme Methodu">
   (Form elemanları buraya )
</form>

HTML’de Temel Form Elemanları

Form parametrelerinin kullandığı eleman türlerini aşağıda sıraladık. Form elemanlarında name parametresi zorunludur. Bu parametre elemanın ismini belirler ve PHP gibi bir dille o elemanın değerini almaya yarar.

Varsayılan Değer leri belirlemek içinse Value parametresini kullanırız. Bu parametreye yazacağımız değerler, elemanın varsayılan veya radio butonlardaki gibi olması gereken değerini belirler.