Простой пример принципа работы и применения AJAX — проверка логина

JavaScript | 18.03.2010 | Метки:

Логотип AJAXЗаметка, описывающая принцип работы AJAX, основанная на олдскульном переводе статьи "Сверхдинамичные вэбинтерфейсы".
В той самой статье давался пример работы технологии AJAX (но он в представленном виде не работал) на примере проверки занятости логина.

Так что исправим пример и добавим функциональность работы с БД (MySQL).
Краткое содержание предыдущей серии версии статьи:
Цель: с помощью AJAX-запросов проверять занятость логина.
Решение: на клиенте используем объект XMLHttpRequest и пачку JavaScript-функций.

Для начала исходный пример использования AJAX (с комментариями на русском :) ).

HTML-файл

PHP-файл

При таком запуске возникает ошибка:
В Internet Explorer: 'response' - есть null или не является объектом
В FireFox FireBug: response.getElementsByTagName("method")[0] is undefined

Причина которой, впрочем, становится понятно при заглядывании во вкладку Net аддона FireFox - FireBug:

Ошибка синтаксического анализа XML: объявление XML или текста не в начале сущности Адрес: moz-nullprincipal:{bca5a75b-786f-4e12-86bf-f684185dc71c} Строка 2, символ 1:
<?xml version="1.0" encoding="UTF-8"
^

Вносим исправление в серверный скрипт, а именно, перенесем строку объявления XML-документа под header.

Доработка примера для работы AJAX с БД MySQL:

Доработка необходима только серверному скрипту checkUserName.php, если точнее только функции nameInUse():

<?php
header('Content-Type: text/xml');
echo '<?xml version="1.0" encoding="UTF-8" standalone="yes"?>';
function nameInUse($q)
{  
//соединение с базой данных 
$conn = mysql_connect('localhost','root','password');
//выбор базы данных MySQL 
$db = mysql_select_db('wwwdb', $conn);
//оператор SQL 
$sql = "SELECT COUNT(*) FROM `USERS` WHERE `USERNAME` = '$q'";
$result = mysql_query($sql,$conn);
//результат запроса
$row = mysql_fetch_array($result);
switch($row[0])
{
	case  '1' :
		return '1';
		break;
	default:
		return '0';
}	
mysql_close($conn);
}
?>
<response>
  <method>checkName</method>
  <result><?php echo nameInUse($_GET['q']) ?></result>
</response>

У меня в общем-то тоже могут быть небольшие ошибки (как выдастся время и настроение все проверю), а так добро пожаловать в комменты с вопросами.


Добавление комментария:

Вы можете использовать эти теги: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" line="" escaped="">