Создание html5 формы с отправкой данных на сервер

Создание html5 формы с отправкой данных на сервер

Необходимые знания:

-Понимание того, что из себя представляет html.

1. Создаем файл index.html
2. Копируем и вставляем базовую разметку в html документ.

<!doctype html>
<head>
    <meta charset="UTF-8">
    <title>Название страницы</title>
</head>
<body>

</body>
</html>

3. Для того, чтобы создать html форму в тег body необходимо добавить следующую конструкцию:

<form method="post" action="">
	<input type="text" name="login" placeholder="Введите логин" required/>
	<input type="password" name="pass" placeholder="Введите пароль" required/>
	<input type="submit" value="Отправить"/>
</form>

Вот и все! Форма для отправки данных на сервер полностью готова. Осталось только написать скрипт, который будет принимать данные из формы на стороне сервера. Подробнее об этом в статье Получение данных из html формы средствами PHP.

Атрибуты html формы:

-Здесь мы должны указать как будет происходить передача данных из полей формы на сервер.

method=""

Существует два метода передачи данных GET и POST. Поскольку в 99% случаях данные отправляемые из формы
конфедициальны , то необходимо всегда использовать POST запрос.

-Здесь указывается адрес, куда введенные данные будут переданы.

action=""
-Создаем текстовый input.

type="text"
-Создаем специальное, защитное поле для ввода пароля.

type="password"
-Создаем специальную кнопку на которую по нажатию будет происходить передача данных на сервер.

type="submit"
-Идентификатор по которому мы будем обращаться к переданным данным.

name=""
-Подсказка для ввода. Данный html5 атрибут не поддерживается старыми браузерами!

placeholder=""
-Делаем поле обязательным к заполнению. Данный html5 атрибут не поддерживается старыми браузерами!

required
-Значение по умолчанию. В нашем же случае мы задаем кнопке текст.

value=""

Читайте также:

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *