
Ders 9: Formlara Giriş
Neden?Formlar web sayfasını kullanıcıdan veri alan bir arayüze dönüştürür.
Ne öğreneceğiz?
Bu derste form, action, method, label, input ve button ilişkisini öğreneceğiz.
Nasıl ilerleyeceğiz?
Önce kavramın amacını düşün. Ardından aşağıdaki örneği kendin yaz. Kodu kaydet, tarayıcıda aç ve küçük bir değişiklik yaparak sonucu gözlemle.
Öğrenme kuralı: Kodu yalnızca kopyalama. Her satır için “Bu satır neden burada?” ve “Bu satırı silersem ne değişir?” sorularını sor.
Derse başlamadan önce kendini yokla
- Bu konuyu gerçek bir web sayfasında hangi ihtiyacı çözmek için kullanırım?
- Örnekteki hangi HTML elementi içeriğin anlamını taşıyor?
- Uygulamayı kendi fikrimle nasıl değiştirebilirim?
Ders sonunda kontrol
- Kodu kendim, bakmadan tekrar yazabildim mi?
- Tarayıcıda sonucu test ettim mi?
- Karşılaştığım bir hatayı neden oluştuğunu açıklayarak düzelttim mi?
Ders hedefi
Kullanıcıdan bilgi almak için temel HTML formu oluşturabileceksin.
Formlar kullanıcıdan veri almak için kullanılır. Formun temel yapısı şöyledir:
PHP Kod:
<form action="/kayit" method="post">
<label for="ad">Adınız:</label>
<input type="text" id="ad" name="ad">
<button type="submit">Gönder</button>
</form>
action verinin gönderileceği adresi, method ise gönderim yöntemini belirtir. GET veriyi URL üzerinde taşır. Arama formları için kullanılabilir. POST veriyi istek gövdesinde gönderir ve kayıt işlemlerinde daha uygundur. Gerçek bir güvenlik mekanizması için sunucu tarafı doğrulama yine gerekir.
<label> etiketi form alanını açıklar. for değeri, ilgili alanın id değeriyle aynı olmalıdır. Bu bağlantı hem kullanılabilirlik hem de erişilebilirlik için önemlidir.
PHP Kod:
<label for="eposta">E-posta:</label>
<input type="email" id="eposta" name="eposta">
Form alanlarında name özniteliği bulunmalıdır. Sunucuya gönderilen veri genellikle bu ad üzerinden okunur.
Ders 9: Formlara Giriş
