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

Відео: Частина 1. Форма зворотнього зв`язку для сайту: PHP-обробник

Я абсолютно впевнений, що, бігаючи по Інтернету, Ви ні разу зустрічали різні форми, наприклад, форму реєстрації, форму входу в систему, форму зворотного зв`язку і багато-багато інших HTML форми.

Власне, форма складається з різних елементів введення: текстових полів, текстових областей, радіо-кнопок, перемикачів, кнопок і так далі.

І в цій статті Ви навчитеся створювати абсолютно будь-які форми в HTML.

Спочатку створіть найпростішу HTML-сторінку, в яку додайте контейнер (тег), вирівнюючий свій вміст по центру. Сподіваюся, що Ви з цим без праці впораєтеся.

А тепер займемося формою. Форма починається з тега. У цього тега є кілька атрибутів, які дуже бажано заповнювати. Але для початку давайте створимо просту форму з атрибутами тега

Тут у нас починається опис форми, у якій є такі атрибути:

1) Атрибут "name". Значення цього атрибута означає ім`я HTML форми. Постає питання, навіщо це треба? Відповідь дуже проста: якщо Ви будете використовувати не одну форму, а кілька, то щоб відрізнити одну форму від іншої, необхідно ставити різні імена. А самі імена потрібні для того, щоб звертатися до форм, наприклад, через jаvascript. Я Вам відкрию маленький секрет, який я Вам не раджу використовувати, але чесності заради, скажу про нього. На самій-то справі, форми можна легко розрізняти і без імен, тому, взагалі кажучи, ім`я форми зовсім необов`язково. Але я НАПОЛЕГЛИВО рекомендую давати формам імена, адже Вам самим так буде простіше зрозуміти, за що кожна з форм відповідає.

2) Атрибут "action". Значення цього атрибута відповідає за шлях до файлу скрипта, який буде обробляти форму. Тобто мало ввести дані в форму, їх же ж ще потрібно відповідним чином обробити, і ось як раз шлях до цього файлу-обробника і знаходиться в значенні атрибута "action".

3) Атрибут "method". У нього може бути одне з двох дуже популярних значення:"post"І"get". Цей атрибут визначає спосіб відправки. Не буду вдаватися в подробиці, просто скажу, що перший спосіб є прихованою відправкою даних, а другий відкритою. Щоб стало ще зрозуміліше, то давайте розглянемо два адреси переходу:

а) https://mysite.ru/scipt/request.php

б) https://mysite.ru/script/request.php?a=7b=Michael

У першому випадку, користувач не бачить, що відправляє (метод "post"), А в другому він реально бачить імена змінних і їх значення (метод"get"). Ви, в кінці статті, можете спробувати відправити форму за допомогою двох різних методів і переконатися в їх відмінності. Але поки що скажу, що НАБАГАТО частіше використовують метод "post", Тобто приховану відправку.

Відео: Створення форми зворотного зв`язку

Це був опис самої форми, а тепер же можна зайнятися додаванням елементів в форму.

Перше, що ми додамо - це текстове поле. Додається текстове поле за допомогою тега, а точніше за допомогою атрибута цього тега "type"Зі значенням"text". Також перед створенням текстового поля рекомендується написати, що це за поле, наприклад,"Ваше ім`я". Усередині тега

Як бачите, знову нічого складного. Як бачите, створити свій сайт - це зовсім не складно. Єдина проблема, як це все запам`ятати? Відповідь дуже проста: практика, практика і ще раз практика!

Всього найкращого!

Відео: Форма зворотного зв`язку в HTML. (Уроки HTML)

З повагою, Михайло Русаков.

P.S. Якщо Ви хочете дізнатися більше по HTML, то подивіться мій безкоштовний курс з прикладом створення сайту на HTML: https://srs.myrusakov.ru/html