HTML Form Nesnesi


 
Bu dersimizde HTML dilinde form etiketi kullanımını inceleyeceğiz. Form nesnesi bir web sayfasında görsel olarak görmediğimiz, yani elle tutulur gözle görülür bir nesne değildir. Örneğin siz bir kanepenin iskeletini görmezsiniz, çünkü üzeri süngerlerle ve kılıfla kaplıdır, fakat iskelet olmazsa kanepe olmaz. İşte form nesneleri de böyledir, form nesnesi olmadan radyo düğümesi, onay kutusu, metin kutusu gibi nesneleri kullanamazsınız, bu nesneler mutlaka form nesnesi içinde yer almalıdır. 

Form nesnesinin en basit kullanımı aşağıdaki gibidir. Fakat action ve metod gibi parametreleri vardır.

<form>
   <!-- Buraya text, checbox, radio, textarea gibi form nesneleri gelecek-->
</form>

Action Parametresi: 
Action parametresi form içeriği doldurulup onaylandığı zaman hangi eylemin yapılacağını belirler. action parametresine örneğin kaydet.php yazarsanız form doldurulup "Gönder" veya "Kaydet" düğmesine basıldığı zaman formun tüm içeriği kaydet.php dosyasına gönderilir, orada veriler alınarak veritabanına kaydetme vb. işlemler yapılır. Biz burada varsayılan olarak PHP programlama dilinde verilerin işleneceğini varsaydık, Java Server Page'de işlenecekse kaydet.jsp vs. olabilir. Asp.net ise kendi özel tag'lerini kullanır ama eski nesil ASP yazarken biz kaydet.asp yazıyorduk. Sonuç olarak ön tarafta yazdığımız HTML kodları değişmez, arka tarafta yazdığınız programlama dili ne ise onu kullanarak form verilerini işlersiniz. 

<form action="kaydet.php">
   <!-- Buraya text, checbox, radio, textarea gibi form nesneleri gelecek-->
</form>


Metod Parametresi:
Form nesnesindeki diğer önemli parametre metod parametresidir, POST veya GET olmak üzere iki değer alır, biz genelde POST kullanırız. Çünkü POST daha güvenlidir ve sınırsız sayıda form nesnesi diğer sayfaya aktarılabilir. Bir iletişim formu, iş başvuru formu vb kayıt formlarında genelde POST parametresi kullanılır. GET parametresi özel yerlerde kullanılır. Metod değerine GET verirseniz kullanıcının form içinde girdiği bütün bilgiler tarayıcının adres çubuğunda görülür. Kullanıcın şifre vb. özel bilgilerini adres çubuğunda güvenlik açısından göstermemek gerekir. Metod parametresi unutulursa, varsayılan olarak GET verilir. 

<form action="kaydet.php" metod="POST">
   <!-- Buraya text, checbox, radio, textarea gibi form nesneleri gelecek-->
</form>
 
Şimdi de aşağıdaki formu yapalım. Burada text ve submit nesnelerini kullandık, bu nesneleri ilerleyen derslerimizde daha detaylı olarak göreceğiz. Şimdilik kısaca bahsedelim, text nesnesi veri girişi için tek satırlık bilgi alır, submit nesnesi ise ekranda bir buton(düğme) çıkarır. 


 
<html>
<head>
<title>Form Uygulamaları</title>
<meta charset="utf-8">
</head>
<body>
<form action="kaydet.php" method="POST">
 
Adı: <br>
<input type="text" name="ad"><br>

Soyadı:<br>
<input type="text" name="soyad"><br>

<input type="submit" value="kaydet">
</form>
</body>
</html>

Bu kodları Sublime gibi bir editörde yazarsanız aşağıdaki gibi renklendirecektir. Kodları Notepad veya Notepad++ gibi bir editörde de yazabilirsiniz. Tüm bu editörleri internetten ücretsiz olarak indirebilirsiniz. 
 


İlerleyen derslermizde text ve submit nesnesini daha detaylı olarak göreceğiz. Checkbox, radio, textarea, select,  submit, button gibi klasik nesnelerin yanında HTML5 ile gelen yeni nesil nesneleri de inceleyeceğiz. Kodları anlasanız bile mutlaka bir editörde yazmayı ihmal etmeyin. Tablet bilgisayarda bile bu kodları yazıp test edebilirsiniz, Web tasarım öğrenmek için çok güçlü donanımlara ihtiyacınız yok. 
 
Mutlu Kodlamalar,
Oğuzhan TAŞ
Kasım, 2018

Bookmark and Share