Как сделать поля ввода логин, пароль.

INPUT и FORM - форма ввода данных

Тег <INPUT> является одним из разносторонних элементов формы и позволяет создавать разные элементы интерфейса и обеспечить взаимодействие с пользователем. Главным образом <INPUT> предназначен для создания текстовых полей, различных кнопок, переключателей и флажков.
Система регистрации не возможна, как минимум без полей ввода логин (input) и поля ввода (input) пароль. Я хочу показать принцип работы и конечно, что представляют сами эти поля, откуда они берутся и как это сделать.
Само поле ввода которое вы видите на сайтах (), т.е. отображаемое браузерами, где есть система регистрации - это есть HTML код, пример ниже.


Листинг № 1 - HTML тег формирующий поле ввода - INPUT

Code:

<input name="" type="text">

У этого тега есть атрибуты, которые описывают его свойства. Например type - описывает тип, т.е. поле для ввода текста ("text"). Атрибут name - это всегда имя этого поля на web странице. Что же это значит? Давайте посмотрим код любой страницы в браузере, например поисковика Яндекс, нажмите на эту ссылку http://ya.ru.
Перед нами открылась страница поисковой системы "Яндекс". Нажмите две клавиши одновременно Ctrl и U (Ctrl+U), вы увидите тот самый код web страницы, который написан для браузера. Помимо тега <input>, на странице ещё масса кода, который нас сечас не интересует. Я просто хотел продемонстрировать как выглядит код который мы видим с вами в браузере, и что он из себя представляет для самого браузера.
Возвратимся к атрибуту name, тега input, как мы уже видели, код страницы представляется огромным сбором всяческих тегов, текста и ещё массы другой информации. Для того чтоб браузер чётко понимал к какой именно форме на странице нужно обратиться, этой форме присваивается имя или ещё называют ID (идентификатор). Это имя (ID), присваивается атрибуту тега name при помощи оператора = и получаем name="здесь имя этого поля", например поле логин, присвоим имя login.
.




Листинг № 2 - Именованное текстовое поле ввода login

Code:

<input name="login" type="text">

После того как мы дали имя нашему полю для ввода логина, таким же методом именуем поле пароль и дадим ему идентификатор pass и заодно подпишем наши поля, чтобы в браузере, пользователю было понятно куда что вводить.


Листинг № 3 - Именованные поля ввода данных Логин и Пароль

Code:

Логин:  <input name="login" type="text">
Пароль: <input name="pass" type="text">

В браузере мы увидим:

поле ввода логина и пароля

Теперь нам необходимо добавить кнопку для отправки пользователем того, что он ввёл, обработчику этой формы. Это значит, что данные введённые в форму отправятся некоему коду, который на основании этих данных предпримет ответный шаг. Этим шагом может быть (ответ на правильно введённые данные): предложение войти на сайт или же наоборот, если данные представленные пользователем не подтверждены, то ему предложат зарегистрироваться на сайте. Это принцип работы сервиса регистрации, так сказать логика (алгоритм) работы.


Листинг № 4 - Именованные поля ввода данных Логин, Пароль плюс кнопка Войти

Code:

Логин:  <input name="login" type="text">
Пароль: <input name="pass" type="text">
<input name="go" type="submit" value="Войти">

В браузере мы увидим следующие:

поле логина и пароля + кнопку войти

Теперь чтобы это всё можно было отправить, не хватает поля <form>. Это поле обобщает все данные которые будут отправлены, а так же в этом теге прописывается путь куда именно надо отправить данные из полей логин и пароль. В данном случаи тег <form> является транспортом который перевозит данные, а кнопку можно сравнить с газом (с командой поехали ). Это все конечно образно. Атрибут action тега <form>, как раз и содержит адрес доставки данных, а атрибут method тега <form> определяет каким способом будет выполнена эта доставка. Ниже можно посмотреть окончательный код для отправки обработчику.


Листинг № 5 - Форма с полями для ввода данных логин, пароль

Code:

<form action="avtor.php" method="get">
Логин:  <input name="login" type="text">
Пароль: <input name="pass" type="text">
<input name="go" type="submit" value="Войти">
</form>

Как мы видим выше, визуально ничего не изменилось, так оно и должно быть. Тег <form>не каким образом не отображается в браузере, этот тег предназначен только для самого браузера, чтоб ему определиться куда направлять данные после срабатывания кнопки с надписью "Войти" и именем (ID) go. В данном случаи данные будут направлены файлу avtor.php, находящемуся в той же директории, что и файл с формой.


Урок закончен.

мы тут одни зажигаем спс темка интересная...

незачто, ща еще буду постить

ещеп с примерами привязки непосредственно к SE...
Спасибо.

Это хтмл как бы=)

---------- Сообщение добавлено в 22:35 ---------- Предыдущее сообщение было в 22:33 ----------

Но раз уж пошла такая пьянка, то:
Авторизация (php + mysql) и запоминание пользователей для начинающих

всем каму понравилось, жмите "Сказать спасибо"

я жманул (ололололо какой я флудер )

Эх, ёпт ... с джавой бы как-нибудь справиццо )))

жаба да...она жестока ...никогда не жнаеш как и хде она проявится

---------- Сообщение добавлено в 22:04 ---------- Предыдущее сообщение было в 21:59 ----------

дамм..интересно....тут получается что почти все статьи пишут новички....я сам недавно с пхп и мускулом разобрался.... а жаба меня я чувствую добьёт.....и умру я молодым в свои 15

Побольше бы уроков которые помогут справится новичкам с SE !!!