Türker
Yeni Üye
Form etiketlerinin asıl amacı, son kullanıcıdan bilgileri alarak yazılıma aktarmaktır. Bundan dolayı her form etiketinin bir name niteliği olur, çünkü yazılım tarafında bu nitelikte belirtilen isimlere göre değerler alınır.
Ve tabii ki türlü türlü form etiketi var, örneğin tek satırlık girdiler için <input>, çok satırlı bilgiler için <textarea>, liste için <select>, birden fazla seçim için checkbox, birden fazla değerde tek seçim için radio etiketleri kullanılır. Tabi bu son ikisi yani checkbox ve radio aslında <input> etiketinin nitelikleri fakat önemli değil bilgi alma açısından en çok kullanıldıkları için belirttim.
Peki örneğin nerelerde kullanılır? Aslında kullanıcıdan veri alınacak her alanda kullanılabilir, en basitinden üye girişi yapılacak bir sayfada şöyle bir kod yazmak yeterli olacaktır;
Burada tabi ki açıklanması gereken çok şey var. Sırayla açıklayalım.
Şu an etiketlerin nasıl tanımlandığını, niteliklerin vs. neler olduğunu anlamak yeterli olacaktır.
Ve tabii ki türlü türlü form etiketi var, örneğin tek satırlık girdiler için <input>, çok satırlı bilgiler için <textarea>, liste için <select>, birden fazla seçim için checkbox, birden fazla değerde tek seçim için radio etiketleri kullanılır. Tabi bu son ikisi yani checkbox ve radio aslında <input> etiketinin nitelikleri fakat önemli değil bilgi alma açısından en çok kullanıldıkları için belirttim.
Peki örneğin nerelerde kullanılır? Aslında kullanıcıdan veri alınacak her alanda kullanılabilir, en basitinden üye girişi yapılacak bir sayfada şöyle bir kod yazmak yeterli olacaktır;
Kod:
<form action="" method="post">
<label for="kadi">Kullanıcı adı</label>
<input type="text" name="kullanici_adi" id="kadi"> <br>
<label for="sifre">Şifre</label>
<input type="password" name="sifre" id="sifre"> <br>
<button type="submit">Giriş yap</button>
</form>Burada tabi ki açıklanması gereken çok şey var. Sırayla açıklayalım.
- <form action="" method="post"> - Form etiketleri bu etiket içerisinde yer alır. Ve bu etiket bazı nitelikler alarak işlevsel hale gelir. En sık kullanılan iki nitelik zaten örnekte yer alıyor, action="" burası form gönderildiğinde hangi adrese gönderilsin bilgiler onun belirlendiği kısım. Boş bırakılır ise mevcut sayfada form gönderme işlemi yapılır. method="post" bu ise, hangi metod ile gönderileceği. POST ile gönderilen formlar URL dediğimiz tarayıcıdaki adres satırında gözükmez değer olarak. Ancak biz bunu post değilde GET olarak belirleseydik o zaman yazılan değerler form gönderildiğinde adres çubuğunda gözükecekti.
- <label for="kadi">Kullanıcı adı</label> - Bu etiket form etiketlerine bağlantı için kullanılır. Burada for="kadi" kısmı, input'taki id="kadi" kısmına eşit. Böylece label etiketine tıklandığında otomatik olarak ilgili form etiketine odaklanır.
- <input type="text" name="kullanici_adi" id="kadi"> - Tek satırlık değerleri kullanıcıdan almak için input etiketi kullanılır. Bu etiket çok türlü amaçlar için kullanılıyor, şimdilik hızlıca bir özet geçelim. type="text" burada text olduğu için normal yazı olarak belirttik ancak type değeri olarak belkide 20'nin üzerinde değer var belirleyebileceğimiz. Bunların hepsine tek tek gireceğiz ancak şimdi değil. name="kullanici_adi" burada önemli olan çünkü dediğim gibi yazılım dillerinde gelen değerleri buradaki name değerine göre alacağız. id="kadi" ise normal id tanımlaması. Zaten ID ve Class bölümünde gördük bunu ancak buradaki amacı label'den tıklandığında bu etikete odaklanması için.
- <input type="password" name="sifre" id="sifre"> - Yukarıdakinin aynısı sadece tipi password buda yazılan değerleri şifreli şekilde göstermeyi sağlıyor web sayfasında.
- <button type="submit">Giriş yap</button> - Button etiketinde eğer type="submit" var ise, ona tıklandığında mevcut form action'da belirlenen adrese method'da belirlenen metod ile gönderilir.
Şu an etiketlerin nasıl tanımlandığını, niteliklerin vs. neler olduğunu anlamak yeterli olacaktır.
