HTML Input form* Özellikleri

Kurs önerileri: <input> Bu bölümde HTML elemanın farklı Özellikler.

form*

input form özelliği form <input> Özellik,

Elemanın ait olduğu form.

Örnek

Bu özelliğin değeri, ona ait <form> özniteliklerinin id özelliği ile eşleşmelidir.

HTML formu dışında (ancak formun bir parçası olarak) yer alan bir giriş alanı:
  <label for="fname">Soyisim:</label>
  <input type="text" id="fname" name="fname"><br><br>
  <input type="submit" value="Gönder">
</form>
<label for="lname">İsim:</label>
<form action="/action_page.php" id="form1">

Kendi Kendine Deneyin

<input type="text" id="lname" name="lname" form="form1">

input formaction formaction özelliği

Yorum: }}öznitelik, formun gönderildiğinde işlenen girişlerin (verilerin) dosya URL'sini belirler. <form> Bu özellik, elemanın Özellikler.

formaction Özellik, aşağıdaki giriş türlerine uygundur: submit ve image.

Örnek

Farklı işlemler (action) olan iki tane gönderme düğmesi olan HTML formu:

<form action="/action_page.php">
  <label for="fname">Soyisim:</label>
  <input type="text" id="fname" name="fname"><br><br>
  <label for="lname">İsim:</label>
  <input type="text" id="lname" name="lname"><br><br>
  <input type="submit" value="Gönder">
  <input type="submit" formaction="/action_page2.php" value="Yönetici olarak gönder">
</form>

Kendi Kendine Deneyin

formenctype özelliği

input formenctype Özellik, form verilerinin gönderilirken nasıl kodlanacağını belirtir (sadece method="post" olan formlar için geçerlidir).

Yorum: }}Bu özellik <form> elemanın enctype özelliği.

formenctype Özellik, aşağıdaki giriş türlerine uygundur: submit ve image.

Örnek

İki tane gönderme düğmesi olan bir form. İlk gönderim, varsayılan kodlama ile form verilerini gönderir, ikinci gönderim "multipart/form-data" kodlaması ile form verilerini gönderir:

<form action="/action_page_binary.asp" method="post">
  <label for="fname">İlk ad:</label>
  <input type="text" id="fname" name="fname"><br><br>
  <input type="submit" value="Gönder">
  <input type="submit" formenctype="multipart/form-data"
  value="Multipart/form-data ile kodlanarak gönder">
</form>

Kendi Kendine Deneyin

formmethod özelliği

input formmethod Özellik, form verilerinin action URL'ye gönderilecek HTTP yöntemini tanımlar.

Yorum: }}Bu özellik <form> elemanın method özelliği.

formmethod Özellik, aşağıdaki giriş türlerine uygundur: submit ve image.

Form verileri URL değişkeni olarak (method="get") veya HTTP post işlemi olarak (method="post") gönderilebilir.

GET hakkında dikkat edilmesi gerekenler:

  • Form verilerini URL'e ad/Değer çifti olarak ekleyin
  • Asla GET ile hassas veri göndermeyin!(Gönderilen form verileri URL'de görülebilir!)
  • URL uzunluğu sınırlıdır (2048 karakter)
  • Kullanıcıların sonuçları书签 olarak eklemek istediği form gönderimleri için çok faydalıdır
  • GET, güvenli olmayan veriler için uygundur, örneğin Google'daki sorgu dizileri

POST hakkında dikkat edilmesi gerekenler:

  • Form verileri, HTTP isteği metninde (URL'de görüntülenmeyen) eklenecektir.
  • POST, büyük miktarda veri göndermek için kullanılabilir, çünkü boyut sınırlaması yoktur.
  • POST ile form gönderimi,书签 eklemek için uygun değildir

İpucu:Form verilerinde hassas veya kişisel bilgiler varsa, POST kullanmak zorunludur!

Örnek

İki tane gönderme düğmesi olan bir form var. İlk tanesi method="get" ile form verilerini gönderir. İkincisi method="post" ile form verilerini gönderir:

<form action="/action_page.php" method="get">
  <label for="fname">Soyisim:</label>
  <input type="text" id="fname" name="fname"><br><br>
  <label for="lname">İsim:</label>
  <input type="text" id="lname" name="lname"><br><br>
  <input type="submit" value="GET ile gönder">
  <input type="submit" formmethod="post" value="POST ile gönder">
</form>

Kendi Kendine Deneyin

formtarget özelliği

input formtarget Özellik, formun gönderildikten sonra hangi adresten veya anahtar kelimenin gösterileceğini belirler.

Yorum: }}Bu özellik <form> elementinin target özelliği.

formtarget Özellik, aşağıdaki giriş türlerine uygundur: submit ve image.

Örnek

İki farklı hedef pencereye sahip iki tane gönderme düğmesi olan bir form var:

<form action="/action_page.php">
  <label for="fname">Soyisim:</label>
  <input type="text" id="fname" name="fname"><br><br>
  <label for="lname">İsim:</label>
  <input type="text" id="lname" name="lname"><br><br>
  <input type="submit" value="Gönder">
  <input type="submit" formtarget="_blank" value="Yeni pencere/sekmeye gönder">
</form>

Kendi Kendine Deneyin

formnovalidate özelliği

input formnovalidate Gönderim sırasında <input> elementinin doğrulanmaması gerektiğini belirtir.

Yorum: }}Bu özellik <form> özniteliklerinin novalidate özelliği.

formnovalidate Özellik, aşağıdaki giriş türlerine uygundur: submit.

Örnek

İki gönderme düğmesi olan bir form (doğrulama yapılır ve yapılmaz):

<form action="/action_page.php">
  <label for="email">E-posta adresinizi girin:</label>
  <input type="email" id="email" name="email"><br><br>
  <input type="submit" value="Gönder">
  <input type="submit" formnovalidate="formnovalidate"
  value="Doğrulama Yapılmayan Gönderim">
</form>

Kendi Kendine Deneyin

novalidate Özelliği

novalidate Özellik <form> Özellikler.

Eğer ayarlanmışsa, novalidate özelliği tüm form verilerinin gönderilirken doğrulanmamasını sağlar.

Örnek

Herhangi bir form verisini doğrulamadan göndermeyi düzenler

<form action="/action_page.php" novalidate>
  <label for="email">E-posta adresinizi girin:</label>
  <input type="email" id="email" name="email"><br><br>
  <input type="submit" value="Gönder">
</form>

Kendi Kendine Deneyin

HTML Form ve Input Elemanları

Etiket Açıklama
<form> Kullanıcı girişini tanımlamak için HTML formu tanımlayın
<input> Giriş Kontrol Cihazı Tanımlama

Tüm mevcut HTML etiketlerinin tam listesine ulaşmak için ziyaret edin HTML Etiket İpuçları Kılavuzu