HTML Dersleri
HTML Form Elemanları
HTML Formlarını en kısa şekilde açıklamak gerekirse; kullanıcının klavye ile girdiği bilgileri işlemek için kullanılır.
Kullanıcı form içeriğine bilgilerini girip gönder butonuna tıkladığında bilgiler sunucu taraflı çalışan bir sayfaya gönderilir ve bu sayfada işlenir. Sunucu taraflı çalışan sayfa form elemanları vasıtasıyla aldığı bilgilerle çeşitli işlemler yapabilir ve kullanıcıya mesaj dönebilir.
Form elemanları ile çalışabilmemiz için öncelikle <form> etiketini tanıyalım.
<form>: Form kontrollerini oluşturan etiketleri içine alarak kullanıcının veri girişi yapmasını sağlayan yapıyı sunmaktadır. Bu yapı içinde klavye veya fare ile kontrol edilebilen metin giriş kutuları, listeler, seçim kutuları, düğmeler ve diğer kontroller eklenebilir. <form> etiketi içinde sunucuya veri gönderecek bütün etiketlerin/elementlerin name özellikleri tanımlanmalıdır.
Form elemanları <form>..</form> etiketleri arasına yazılır.
HTML Form Kullanımı
<form>
<input>
</form>
HTML Formları - <input> (giriş) Elementi: En çok kullanılan form etiketidir. <input> elementi kullanıcı bilgilerini seçmek için kullanılır. Kapatılmaz. <input> elementi içerisinde kullanılan type ifadesiyle girdi türü belirlenir.
<input> Kullanım Örneği ve Metin Alanları (textbox)
<form>
Adınız:
<input type="text" name="isim">
Soyadınız:
<input type="text" name="soyad">
</form>
Örnek Gösterimi
<input type = "checkbox"> Sunulan seçeneklerden istenildiği kadar seçilmesini sağlar.
<input> Kullanım Örneği ve Kontrol Kutucukları (Checkboxes)
<form>
Bir bisikletim var:
<input type="checkbox" name="Tasit" value="Bisiklet">
<br>
Bir arabam var:
<input type="checkbox" name="Tasit" value="Araba">
<br>
Bir kamyonum var:
<input type="checkbox" name="Tasit" value="Kamyon">
</form>
<form>
Şifrenizi Giriniz:
<input type="password" name="Sifre">
</form>
Örnek Gösterimi
Formlarda "Action" Parametresi ve Gönder (Submit) Butonu
<input type=submit> etiketi, kullanıcının formu göndermesini sağlayan bir düğme (button) kontrolü oluşturulmasını sağlar. Action parametresinde ise bilgilerin hangi dosyaya gönderileceği belirtilir. Bilgilerin gönderildiği dosya, genellikle gelen bilgilerle ilgili ne tür işlem yapılacağı hakkında bilgiler içerir.
<input> Kullanım Örneği ve Formlarda "Action" Parametresi ve Gönder (Submit) Buton
<form name="input" action="fomrornek/action_submit.php"
method="get" target="_blank">
Kullanıcı Adı:
<input type="text" name="kullanici">
<input type="submit" value="Gönder">
</form>
Kullanıcı, submit butonuna tıkladığında veriler, method özelliği ile belirtilen yöntemle bu adrese gönderilir.
form.method özelliği, form verilerinin sunucuya gönderilme yöntemini belirtir. HTML form verileri
"get" "post" olmak üzere iki şekilde sunucuya gönderilebilir.
"get" yönteminde form verileri isim-değer çifti olarak action özelliği ile belirtilen adrese sorgu olarak eklenip sunucuya gönderilir.
"post" yönteminde ise veriler, HTTP isteği
(HTTP Request) içinde bir veri paketi olarak gönderilir.
"post" yöntemi ile sunucuya gönderilebilecek veri miktarı hakkında teorik olarak bir limit yoktur.
|
Form Etiketleri |
|
Form Parametreleri |
Örnek E-posta Gönderim Formu
<html>
<body>
<b>Örnek E-posta Gönderim Formu</b>
<form action="MAILTO:leucjo@gmail.com" method="post" enctype="text/plain">
Adınız:<br>
<input type="text" name="ad" value="İsminizi Giriniz"><br>
E-Posta:<br>
<input type="text" name="posta" value="E-Posta Adresiniz"><br>
Mesaj:<br>
<input type="text" name="mesaj" value="Mesajınız" size="50"><br><br>
<input type="submit" value="Gönder">
<input type="reset" value="Temizle">
</form>
</body>
</html>
Örnek Gösterimi