HTML formları

<form> kullanıcı verisini toplar: action verinin gönderileceği adresi, method gönderme yöntemini (get veya post) belirtir. Her alan bir <input> ile yazılır, adı için <label> kullanılır; for özniteliği label'ı alanın id'sine bağlar.

<form action="/subscribe" method="post">
  <label for="email">Email</label>
  <input id="email" name="email" type="email" required>
  <button type="submit">Subscribe</button>
</form>

name özniteliği yoksa alanın değeri gönderilmez. label'a tıklamak alanı etkinleştirir, bu mobilde çok rahattır.

type özniteliği tarayıcıya alanın ne için olduğunu söyler: text, email, password, number, date, checkbox, radio, file. Doğru tip mobil klavyeyi uyarlar ve doğrulama yapar. Uzun metin için <textarea>, açılır liste için <select> vardır.

<input type="number" name="age" min="0" max="120">
<input type="date" name="birthday">
<input type="checkbox" id="agree" name="agree"> <label for="agree">I agree</label>
<select name="city">
  <option value="baku">Baku</option>
  <option value="ganja">Ganja</option>
</select>
<textarea name="message" rows="4"></textarea>

• required alanın doldurulmasını zorunlu kılar.
• minlength, maxlength, min, max ve pattern sınır koyar.
• placeholder ipucudur, label'ın yerini tutmaz.
• <button type="submit"> gönderir, type="reset" temizler.

Tarayıcı doğrulaması kolaylık içindir; güvenlik için veriyi mutlaka sunucuda da doğrula.

<input type="text" name="user" minlength="3" maxlength="20" required placeholder="Username">
<input type="text" name="zip" pattern="[0-9]{4}" title="4 digits">