Форми

Форми — це ключовий інструмент для збору даних користувача та їх надсилання на сервер для обробки. Вони складаються з різних елементів форми, які дозволяють користувачам вводити дані. Однак у цьому курсі ми не будемо надсилати жодних даних на сервер, оскільки це потребує додаткових знань, що виходять за межі цього курсу.

У всіх прикладах коду використовується атрибут onsubmit="return false". Цей атрибут за замовчуванням запобігає надсиланню форми на сервер.

Створення форм

Тег <form> використовується для створення інтерактивної форми на веб-сторінці. Він містить різні елементи форми для введення даних користувача.
Приклад:

<form>
  <!-- Form elements go here -->
</form>

Елементи форми

HTML надає різні типи полів для збору даних користувача. Кожен має певні атрибути та поведінку. Також можна вказати мітку для кожного поля. Мітки використовуються для асоціації тексту з елементами введення форми, забезпечуючи більш доступний та зручний інтерфейс. Ми детально розглянемо мітки та поля введення у наступних розділах.
Приклад:

<form>
  <label for="username">Username:</label>
  <input type="text" id="username" name="username" placeholder="Your username" />
  <label for="password">Password:</label>
  <input type="password" id="password" name="password" placeholder="********" />
</form>

Надсилання форми

Надсилання форми здійснюється за допомогою кнопки відправки (<button type="submit">), яка може передати дані форми на сервер для обробки.
Приклад:

<form>
  <label for="username">Username:</label>
  <input type="text" id="username" name="username" placeholder="Your username" />
  <label for="password">Password:</label>
  <input type="password" id="password" name="password" placeholder="********" />
  <button type="submit">Submit</button>
</form>

Ось базовий приклад форми.

Відеоінструкція