[X] Помощник

[Vialls_mw Topic Starter]

"Введение в Ajax"
Для тех, кто не знает, что такое Ajax - читать тут.
В этой статье я расскажу, как создавать объект XMLHttp и посылать HTTP запросы серверу с помощью этого объекта.
И так, надеюсь как вы поняли, в Ajax HTTP запросы отправляются с помощью объекта XMLHttp. Проблема создания этого объекта состоит в том, что в браузерах InternetExploder это Activex объект MSXML, в остальных популярных браузерах это объект XMLHttpRequest, воспроизводящий функциональность объекта MSXML от микрософт. Сейчас мы напишем кроссбраузерную фукнцию для создания этого объекта:

function createXmlHttp()
{
  if (typeof XMLHttpRequest != "undefinder")
  {
    return new XMLHttpRequest();
  }
  else if (window.ActiveXObject)
  {
    var Versions = ["MSXML2,XMLHttp.5.0","MSXML2.XMLHttp.4.0","MSXML2.XMLHttp.3.0","MSXML2.XMLHttp","Microsoft.XMLHttp"];
    for (var i = 0; i < Versions.length; i++)
    {
      try
      {
        var XmlHttp = new ActiveXObject(Version[i]);
        return XmlHttp;
      }
      catch (oError)
      {
        ////////
      }
    }
  }
  throw new Error("Не возможно создать XMLHttp");
}

Эта функция узнает, какой класс нужно ей создать, создает и возвращает его.
Теперь создать объект XMLHttp, очень просто:

var XMLHttp = createXmlHttp();

Сейчас я покажу пример, отправки GET запроса серверу:

XMLHttp.open("get", "anekdot.php?id=" + id, true);
XMLHttp.onreadystatechange = function()
{
  if (XMLHttp.readyState == 4)
  {
    if (XMLHttp.status == 200)
    {
       alert("Анекдот: " + XMLHttp.responseText);
    }
    else
    {
       alert("Ошибка!");
    }
  }
}
XMLHttp.send(null);

В этом коде вызывается метод open(), который выполняет асинхронный запрос типа GET на страницу anekdot.php. Далее обработчику событий onreadystatechange, назначается функция, которая будет выполняться, после получения ответа от сервера. В этой функции мы проверяем значение свойства readyState и если оно равно четырем, проверяем код статуса, если он равен 200, то ошибок не возникло. Текст, возвращаемый сервером, храниться в переменной responseText класса XMLHttp.
Код файла, anekdot.php думаю приводить не стоит, и так все понятно, скрипт выбирает из базы анекдот с ID равным нашему GET запросу и выводит его.

Попозже напишу статью про посылку POST запроса.

[Zinder]

Спасибо, очень интересно!

[ltb]

Все это конечно же хорошо, но лучше юзать фрэймворки типа jQuery, Prototype

[ilyazh]

Полностью согласен. jQuery гораздо удобнее и проще в изучении. Использую его и доволен, чего и другим советую (использовать фреймворки).
Как говориться, нафига изобретать велосипед? )

[ZiTosS]

ilyazh, уважаемый... сразу переходить к фреймёкам конечно можно. Но многие не знаю даже синтаксиса JS и как осуществляется передача. А это бы стоило почитать... Потом на многих форумах только и видишь темы:
"Помогите, не могу в jQuery выполнить запрос к серверу"
"Или руки кривые, или jQuery примеры не рабочие"
и т.д.

А ведь зачастую людям просто лень что-то самим изучить или сделать. Либо они утверждают себе, что они ГУРУ и им не надо изучать азы, что приводит к плачевным результатам.
И если хотите знать, все библиотеки используют именно данный объект и похожие методы запроса, только чтобы скрыть их они используют функции-обработчики, замыкания, объекты. Вся внутренняя обработка при обращении с Ajax в библиотеках построена по такому же принципу. Поэтому грех не знать, как же это устроено.

[ilyazh]

Ну то что юзеры не хотят разбираться, то фреймворк тут не причём. Их лень - их проблема.

Замечание модератора: Эта тема была закрыта автоматически ввиду отсутствия активности в ней на протяжении 100+ дней. Если Вы считаете ее актуальной и хотите оставить сообщение, то воспользуйтесь кнопкой или обратитесь к любому из модераторов.