Proqramlaşdırma

HTML formları

form, input, label, button və sahə növləri.

Bütün dərslər · HTML dərsləri: sıfırdan öyrən

form, label və input

<form> istifadəçi məlumatını toplayır: action məlumatın göndəriləcəyi ünvanı, method isə göndərmə üsulunu (get və ya post) göstərir. Hər sahə <input> ilə yazılır, onun adı üçün isə <label> işlədilir; for atributu label-i sahənin id-sinə bağlayır.

<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 atributu olmasa sahənin qiyməti göndərilmir. label-ə klikləmək sahəni aktivləşdirir, bu da mobil istifadəçilər üçün çox rahatdır.

Sahə tipləri

type atributu brauzerə sahənin nə üçün olduğunu deyir: text, email, password, number, date, checkbox, radio, file. Düzgün tip mobil klaviaturanı uyğunlaşdırır və yoxlama aparır. Uzun mətn üçün <textarea>, seçim siyahısı üçün <select> var.

<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>

Yoxlama və düymələr

  • required sahənin doldurulmasını tələb edir.
  • minlength, maxlength, min, max və pattern limit qoyur.
  • placeholder ipucudur, label əvəzi deyil.
  • <button type="submit"> göndərir, type="reset" təmizləyir.

Brauzer yoxlaması rahatlıq üçündür; təhlükəsizlik üçün məlumatı mütləq serverdə də yoxla.

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

Müəllif: Nibras Code