Türker
Yeni Üye
HTML Form Elemanları
Bu yazıda HTML form elemanlarını öğreneceğiz. Nedir bunlar ne işe yarar önce bunlardan bahsedelim... Form elemanlarını, kullanıcı bilgi girişinde kullanır. Form elemanları kullanıcı adı, şifre girişi gibi alanlar oluşturmamızı sağlar. Aynı zamanda onay kutuları oluştururken de kullanırız. Mesela kullanıcıdan evli veya bekar olduğu, evi arabası olup olmadığı bilgilerini alırken form elemanlarıyla oluşturacağımız onay kutularından yararlanırız.Form elemanları <form>..</form> etiketleri arasına yazılır. input en çok kullanacağımız form etiketidir. Kapatılmaz. input etiketi içerisinde kullanılan type ifadesiyle girdi türü belirlenir. Bir örnek yapacak olursak:
HTML:
<html>
<body>
<form>
Ad: <input type="text" name="name"><br/>
Soyad: <input type="text" name="lastname">
</form>
</body>
</html>
HTML:
<html>
<body>
<form>
Ad: <input type="text" name="firstname" value="adınızı giriniz"><br/>
Soyad: <input type="text" name="lastname" value="soyadınızı giriniz"><br/>
<input type="submit" value="Gönder">
</form>
</body>
</html>
Submit ifadesiyle buton oluşturduk. Value ise butonun ve kutucukların içindeki ifadeleri yazmamızda kullanıldı. Onay kutuları oluşturmamızda da işe yarayacağından bahsetmiştik. Bununla ilgili ilk örneğimizi de yapalım.
HTML:
<html>
<body>
<form>
<input type="radio" name="cinsiyet" value="bayan">Bayan<br/>
<input type="radio" name="cinsiyet" value="erkek">Erkek<br/>
<input type="submit" value="Kaydet">
</form>
</body>
</html>
• Bayan
• Erkek
Üstteki örnekte görülen "radio" ifadesi tek seçeneği seçmemizi sağlar. Birden fazla seçenek seçmemizi gerektiren durumlar da ise checkbox ifadesini kullanırız.
HTML:
<html>
<body>
<h5>Hangi Tür Müzikleri Seversiniz</h5>
<form>
<input type="checkbox" name="music" >Pop<br/>
<input type="checkbox" name="music" >Rock<br/>
<input type="checkbox" name="music" >Arabesk<br/>
<input type="checkbox" name="music" >Türk Sanat Müziği<br/>
<input type="submit" value="Kaydet">
</form>
</body>
</html>
• Pop
• Rock
• Arabesk
• Türk Sanat Müziği
Son olarak açılır liste oluşturmayı da görelim:
HTML:
<html>
<body>
<h5>İlk öğrendiğiniz programlama dilini seçiniz</h5>
<form>
<select name="proglamlama dilleri" >
<option value="C">C<br/>
<option value="C++">C++<br/>
<option value="Pascal">Pascal<br/>
<option value="Java">Java<br/>
</select>
</form>
</body>
</html>
Form elemanları kullanıcıdan bilgi almak için kullanılır demiştik. Bu derste veri almanın, görsel kısımlarını gördük. Ancak alınan verinin işlenmesi için PHP, JSP veya ASP.NET gibi web programlama dillerini bilmek gerekir. Şayet verinin işlenmesi dışında, saklanması da gerekiyorsa, genellikle ilişkisel bir veritabanı (RDBMS) kullanılır. Bu konular farklı uzmanlıklar gerektiriyor. Konu fazlalılığı gözünüzü korkutmasın; aradaki noktaları zamanla birleştireceksiniz.