/ HTML
  1. HTML
  2. HTML Form Oluşturma

HTML Form Oluşturma

Form elemanlarını ziyaretçilerin veri girdiği yerler olarak tanımlayabiliriz.

Form yapısı ziyaretçilerin seçimler yapacağı ve sonrasında bu değerleri size gönderdiği yapılardır. Formlar bir sayfanın içerisinde kullanılabildiği gibi aynı zamanda kendi başına da bir sayfa olabilir. Diğer HTML etketleri gibi kullanılır. <form> … </form> etiketleri arasına yazılır.

Action ve Method Parametresi

Method GET ve POST olmak üzere iki değer alır. GET form verilerini action ile seçili adrese sorgu olarak eklenip bu şekilde sunucuya gönderilir. Tarayıcı üzerinden gönderilir. POST ise bu işlemi gizli olarak yapar ve değerler gözükmez.

Action özelliği verilerin gönderileceği adresi belirtmemizi sağlar.

1
2
3
4
5
<form name="deneme" action="https://www.botbenson.com/deneme.php" method="post">

...

</form>

Input

sunucuya veri göndermek amaçlı kullanılan farklı form elemanlarını oluşturmak içni kullandığımız HTML etiketidir.type özelliği ile eleman seçebiliriz. input etiketi name değeri almak zorundadır.

Input Etiketi Parametreleri

  1. type: Form elemanı tipini belirler. (button, radio, text vb.) Default değeri text olarak alınır.

  2. name: Her input etiketi için kullanmak zorunda olduğumuz, veri alanı adı girilen yerdir. Bir anlamda ID denebilir. name=”deneme” olarak kullanılır.

  3. value: Form elemanlarına verilen değerdir. Kullanmak zorunlu değildir, value=”deneme” olarak kullanılır.

  4. size: text ve password elemanlarında karakter sayısını, diğer elemanlarda genişliği piksel olarak tutmaktadır.

  5. checked: radio ya da checkbox için kullanılır. Birden fazla seçim alanında seçili olarak gelmesi için kullanılır.

  6. disabled: Form elemanını veri girişi için pasif hale getirir.

Form Elemanları

image, text, checkbox, file, password, submit, reset, hidden, radio, button gibi type özelliği atanabilen 10 adet form elemanı vardır ve kullanımları şu şekildedir;

Kullanıcının veri gireceği alandır. password’un tek farkı girilen her karakteri “*” olarak gösterir ve kullanımı aşağıdaki gibidir.

1
2
3
4
5
6
7
8
9
10
11
<form>
Kullanıcı: <input type="text" name="kullaniciadi"> <br>
Şifre    : <input type="password" name="sifre"> <br>
Checkbox : <input type="checkbox" name="checkbox"> <br>
File     : <input type="file" name="file"> <br>
Hidden   : <input type="hidden" name="hidden"> <br>
Radio    : <input type="radio" name="radio"> <br>
Reset    : <input type="reset" name="reset"> <br>
Button   : <input type="button" name="button"> <br>
Submit   : <input type="submit" name="submit"> <br>
</form>