В процессе получения данных с помощью AJAX запроса иногда проходит значительное время. К тому же, если передаваемые данные - массив или переменная это один случай, а если содержимое слоя или объемный HTML код, это то случай, когда возможна задержка вывода полученных получаемых данных на странице.

Приведу пример как можно реализовать индикацию процесса.

  • Небольшое отступление: будь то форма загрузки изображений или еще что то, правило хорошего тона гласит - отключайте активные элементы управления, инициирующие AJAX запрос или отправку формы на сервер, так вы исключите повторную отправку данных, путаницу или ошибки в своей БД …

Читать полностью

Рубрика: Programming

Теги: , , ,

Всем, кому когда-либо доводилось разрабатывать сложные формы, с заранее неизвестным количеством полей (элементов), либо ряд похожих форм с незначительными отличиями, задавался вопросом, как таки автоматизировать передачу данных скрипту-обработчику. Речь пойдет о следующей модели формы:

форма -> AJAX запрос -> backend -> событие

Чем таки отличается такая модель от классической, когда происходит сабмит формы, данные обрабатываются тем же скриптом, что осуществляет вывод формы? Навскидку: в случае неверно заполненной формы, в первом случае не происходит перезагрузка окна браузера, выводится сообщение в браузер (я использую модальные окна для юзерской части), ну и введенные данные остаются в форме, что достаточно быстро позволяет исправить ошибки и инициировать отправку данных снова.

Читать полностью

Рубрика: Programming

Теги: , ,

Если вы пишете на Java Script или используйте в своих разработках AJAX вам совершенно необходим инструмент отладки.

В случае использования JS конструкций, их выполнение (ошибки) еще как то можно отладить с помощью сообщений IE и IE-подобных браузеров (IE - internet explorer), если нажать на символ ошибки в нижнем левом углу браузера. Однако все примитивно и порой тупо невозможно отследить источник ошибки - будь то ошибка синтаксиса или неверная интерпретация.

В случае отладки AJAX запросов все гораздо печальней, вышеупомянутая возможность IE практически не дает никакой возможности проконтролировать исполнение запроса. Промучившись определенным образом, собственно было найдено решение - плагин Firebug для браузера Mozilla Firefox .

Итак, что я получил скачав и установив последовательно связку FF-Firebug:

  • возможность пошаговой отладки Java Script
  • возможность проверки заголовков (headers) в HTTP запросе, для чего это нужно - ну к примеру для эмуляции каких-либо действий пользователя
  • возможность отследить что посылает серверу AJAX запрос и что получает обратно

Следующие возможности были вторичны для меня, но Firebug умеет еще и такое:

  • работа с DOM документа
  • работа с HTML
  • работа с CSS

Более полно можно ознакомится с возможностями плагина на официальном сайте: firebug.ru .

Рубрика: Programming

Теги: , ,

Каждый кто занимался разработкой интерфейсов (админок, форм), знает как порой нужно на лету изменять поведение элемента управления, будь то выпадающий список или чекбокс. Так вот собственно для этого на стороне пользователя и существует AJAX и старый добрый Java Script. Довольно древняя технология, получившая популярность в последние пару лет благодаря новому веянию, такому как Web 2.0. Не буду вдаваться в подробности, их можно узнать перейдя по ссылке.

Исходя из собственного опыта, впервые столкнулся и стал применять аякс, воспользовавшись библиотекой Дмитрия Котерова, JsHttpRequest. По сути штука неплохая, учитывая что Котеров довольно сильно разжевал как обращаться с этим инструментом.

Однако, приходилось писать довольно длиные JS конструкции, которые не всегда кроссбраузерно работали, ну и на стороне сервера требовалось инклюдить php-часть библиотеки. Хотелось найти чтото универсальное, емкое, не задумываться о кроссбраузерности, писать конструкции на лету.

Это решение - фреймворк Jquery, соединяющий в себе библиотеку AJAX и по сути замену JS. Итак, взяв на вооружение сей инструмент, вы получаете взамен:

  • отказ от длиных конструкций JS, вроде document.getElementById(”select_list”).innerHTML
  • кроссбраузерность
  • возможность менять CSS документа налету, пример $(’#id’).css(’color’,'black’)
  • библиотеку AJAX
  • огромное количестве плагинов к Jquery, реализующих совершенно разные возможности

Все что нужно для использования Jquery, так это скачать библиотеку с официального сайта: http://jquery.com/. Существуют несколько разновидностей библиотек, отличающихся размером (в kb), и сжатием исходника. Пробовал разные, не ощутил особой разницы, поэтому рекомендую качать библиотеку с наименьшим размером файла.

Полезные ссылки:

http://blog.termit.name/jquery/ : ссылки на статьи, полезные ресурсы о Jquery

http://www.rsdn.ru/article/inet/jQuery.xml : эта статья очень полезна для начинающих

http://visualjquery.ru/ – документация по jQuery в удобном виде

Рубрика: Programming

Теги: , , ,