HTML’de Form Etiketleri

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.

Bu konunun benzerini PHP yazımız içerisinde bulabilirsiniz. Çünkü bu seviyeden sonra PHP ve HTML iç içe konularla size daha da profesyonel websiteleri yapmanızın kapılarını açacağım.

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.

Eleman türü Açıklaması Örnek Görünüm
text Metin kutusu <input name="metin" type="text" value="varsayılan değer" />
password Şifreler için kullanılan Metin kutusu <input name="sifre" type="password" value="varsayılan değer"/>
checkbox Onay kutusu <input name="onay" type="checkbox" />
radio Radyo buton <input name="cinsiyet" type="radio" value="erkek" /> Erkek <input name="cinsiyet" type="radio" value="kadin" /> Kadın Erkek Kadın
file Dosya seçme elemanı <input name="dosya" type="file" />
textarea Büyük metin alanı <textarea name="metin">varsayılan değer</textarea>
select, option Seçim listesi ve seçim listesi seçenekleri <select name="liste"><option value=”bursa”>Bursa</option>

<option value=”istanbul”>İstanbul</option>

<option value=”ankara”>Ankara</option>

</select>

submit Form gönderme tuşu <input name="gonder" type="submit" value="Gönder" />

Bunca bilgiden sonra basit bir Form oluşturalım ve onun görünümüne bakalım.

<h2>ÜYELİK FORMU</h2>
<form action="islem.php" method="post">
 Ad: <br/>
 <input type="text" name="ad" /><br/>
 Soyad: <br/>
 <input type="text" name="soyad" /><br/>
 E-Posta: <br/>
 <input type="text" name="eposta" /><br/>
 Cinsiyet: <br/>
 <input type="radio" name="cinsiyet" value="1" /> Erkek<br/>
 <input type="radio" name="cinsiyet" value="2" /> Kadın<br/>
Cep Telefonu: <br/>
 <input type="text" name="ceptel" /><br/><br/>
 <input type="submit" value="Gönder" />
</form>

Formun görünümü aşağıdaki gibi olacaktır.
uyelik-formu

Form işleminin bundan sonrası için PHP benzeri bil dil gerekmektedir. Onun için konunun devamını buradan takip edebilirsiniz.

DAHA FAZLA İÇERİK

PHP ile Merhaba Dünya PHP ile Merhaba Dünya

4 Aralık 2014, Perşembe

Windows 10 Tanıtım Videosu Windows 10 Tanıtım Videosu

19 Aralık 2014, Cuma

GSM Operatör Devi Turkcell Hacklendi! GSM Operatör Devi Turkcell Hacklendi!

15 Aralık 2014, Pazartesi

SİZDE YORUM YAPIN

Iphone 4 Macerası

Iphone 4 Macerası 1 Aralık 2014, Pazartesi

Trello Nedir? Nasıl Kullanılır?

Trello Nedir? Nasıl Kullanılır? 11 Şubat 2017, Cumartesi

Facebook Gruba Toplu Arkadaş Ekleme

Facebook Gruba Toplu Arkadaş Ekleme 20 Şubat 2016, Cumartesi

Bilgisayarda DNS Ayarları

Bilgisayarda DNS Ayarları 24 Aralık 2015, Perşembe