Как отобразить сообщение об ошибке, используя ajax рядом с текстовым полем?

Question

Я только начал PHP. Я создал форму, в которой есть три текстовых поля (имя, адрес электронной почты, возраст). Теперь предположим, что я заполнил deepak в textbox1, а затем я нажимаю tab, чтобы перейти к следующему текстовому полю, но я оставляю его пустым, а затем снова нажимаю tab и g в последнем текстовом поле. Когда я перехожу к третьему текстовому полю, справа от текстового поля 2 должно появиться сообщение об ошибке (пожалуйста, заполните адрес электронной почты). Как я могу это сделать? Я знаю, что для этого будет использоваться ajax, потому что я не обновляю страницу. Пожалуйста, приведите пример. Потому что, как только я получу его, я смогу применить его ко всем коробкам ...

                          Thanking You in Advance...

Answer 1

Ajax не всегда требуется в вашей программе,

Сначала мы должны объяснить, что такое ajax, ajax - очень простая технология,

1. у вас есть страница php (или любой сервер), которая получает некоторые входные данные (* 1) и генерирует некоторые выходные данные (* 2)
2. требуется страница html + javascript, которая показывает базовую страницу, затем при необходимости (нажатие клавиши или любое другое событие) отправляет запрос на страницу php (* 1), затем ожидает ответа от страницы php (* 2) выполнить пользовательскую функцию (* 3), после получения результата событие javascript (* 3) обновит вашу страницу.

поэтому в вашей проблеме, если вы хотите проверить что-то особенное с адресом электронной почты пользователя (проверить ранее зарегистрированного пользователя), вы можете использовать ajax, но если вы просто хотите проверить, является ли электронная почта действительной или нет, вы можете использовать простой код JavaScript

Answer 2

это не ajax, все, что вам нужно, это манипулировать dom с помощью чистого JavaScript.

Answer 3

Не копаясь в реализации [что зависит от того, используете ли вы конкретную библиотеку JS и в приведенной ссылке есть один пример], вам следует:

1. Найдите элемент, который вы хотите использовать в качестве якоря
2. создайте еще один элемент с дочерним DOM-приложением рядом с вашим якорем и заполните его содержимым, которое вы хотите отобразить.

Вы можете взглянуть на этот пример:

http://www.dustindiaz.com/add-remove-elements-reprise/

Answer 4

На самом деле было бы лучше проверить электронную почту на событие размытия, то есть когда оно теряет фокус (используя библиотеку jquery):

$('#email').blur(function (){
email = $('#email').val();
if(email.length() == 0)
{
    $('#email-error-label').val('Please fill in email');  
}  
});

P.S .: Не используйте для проверки только код на стороне клиента, потому что, если кто-то отключит JS в своем браузере, проверка не будет работать.

Answer 5

В фокусе ввода возраста вы можете отправить текст на наличие текста в поле электронной почты, используя jQuery.

Если у вас есть следующий HTML

<input type="text" id="email" />
<p id="email-error-label"></p>
<input type="age" id="email" />

Вы можете использовать следующий JavaScript:

$('#age').focus(function (){
  email = $('#email').val();
  if(email.length() == 0)
  {
    $('#email-error-label').val('Please fill in email');
  }  
});

Примечание: я не проверял этот код