"Geleceğe atılan doğru bir adım..."
Bilgi Eğitim Bilgisayar Kursu Ders Notları

Web Tasarım Kursu - HTML Form Elemanları

İnternet üzerinde kullanıcıdan bilgi almayı sağlayan ögelerdir. Üye olmak, üyü için oturum açmak, site içinde arama yapmak gibi durumlarda kullanılır. Bu kutucukları oluşturmak HTML kodları ile yapılır. Fakat buraya girilen bilgileri çekmek, almak, üye yapmak, oturum açtırmak, site içinde arama yapmak, yönetim paneli yazmak PROGRAMLAMA ile yapılabilecek işlerdir.

 

Form tasarlarken en dışa <form></form> açılır. Bütün Form ögeleri bu araya yazılır. Her form ögesine bir isim (name) verilir. Programcı o kutucuğa girilen bilgileri name alanlarını kullanarak çeker. name alanlarında boşluk, Türkçe karakter kullanılmaz. Boşluk yerine alt tire (_) kullan.

 

Formlarda method get veya post olabilir. Formlarda güvenlik açığı olmaması için method POST olmalıdır.

 

Post Methodu :  Sınırsız bilgi gönderir. Adres çubuğunun üst kısmını (http header) kullanır.  Güvenlidir.

 

Get methodu :Max 2048 karaktrer gönderir. Adres çubuğunu kullandığı için güvenli değildir.

 

Formun action kısmında Asp veya Php bir sayfaya yönlendirmek sureti ile bilgileri çekebiliriz. Action boş olursa sayfa kendine yönlendirilmiş olur.

 

Value : Seçim yapılan alanlarda kullanılır. İçine alağı değeri tanımlar. Name alanlarında Türkçe karakter boşluk kullanma, valueda kullan.

Tek seçenek seçilecek ise radio kullan. Radioların nameleri aynı olsun.

Çok seçenek seçilecekse checkbox kullan. Nameleri farklı olsun.

 

<formmethod="post"action="formu-gonder.php">

Ad Soyad<br>

<inputtype="text" name="ad_soyad" size="25" maxlength="30" placeholder="İsim Soyisim" required><br><br>

 

Email Adresi <br>

<input type="email" name="email_adresi" size="25" maxlength="40" placeholder="abc@def.com"required><br><br>

 

Şifre <br>

<input type="password" name="sifre" size="25" maxlength="8"><br><br>

 

Cinsiyet <br>

<input type="radio" name="cinsiyet" value="Bay">Bay

<inputtype="radio" name="cinsiyet" value="Bayan">Bayan

<br><br>

 

Hobileriniz <br>

<input type="checkbox" name="hobi1" value="Sineme">Sinema

<inputtype="checkbox" name="hobi2" value="Müzik">Müzik

<inputtype="checkbox" name="hobi3" value="Kitap">Kitap

<inputtype="checkbox" name="hobi4" value="Spor">Spor

<br><br>

 

Eğitim Durumu <br>

<select name="egitim_durumu">

        <optionvalue=" ">Seçiniz</option>

        <optionvalue="İlkokul">İlkokul</option>

        <optionvalue="Ortaokul">Ortaokul</option>

        <optionvalue="Lise">Lise</option>

        <optionvalue="Üniversite">Üniversite</option>

</select>

 

<br><br>

 

Adres <br>

<textarea name="adres" rows="4" cols="20"></textarea>

<br><br>

 

<input type="reset" value="Formu Temizle">

<input type="submit" value="Formu Gönder">

 

</form>