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

форма -> 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

Теги: , ,

При преобразовании путей URI - к примеру из названия категории, являющегося кириллическим в часть URI, которая является латиницей, возникает потребность прямого и обратного преобразования в транслит.

Строго говоря, транслитом называется написание кириллического текста латиницей, но я сделаю допущение, что существует и обратный процесс. Исследовав сеть на предмет таблиц соответствия символов, была найдена куча таблиц и несколько функций одностороннего преобразования в транслит, что не вписывалось в постановку задачи - “прямое и обратное преобразование”.

Следующая функция позволяет преобразовать строку как кириллицу->латиницу, так и латиницу->кириллицу:

function translit ($str)
{
$str=strtolower($str);
$en_to_ru = array(”a”=> “а”,”b”=> “б”,”v”=> “в”,”g”=> “г”,”d” => “д”,”e”=> “е”,”jo”=> “ё”,”zh”=> “ж”,”z”=> “з”, “i”=> “и”, “j”=> “й”, “k”=> “к”, “l”=> “л”, “m”=> “м”, “n”=> “н”, “o”=> “о”, “p”=> “п”, “r”=> “р”, “s”=> “с”, “t”=> “т”, “u”=> “у”, “f”=> “ф”, “h”=> “х”, “c”=> “ц”, “ch”=> “ч”, “sh”=> “ш”, “sch”=> “щ”, “#”=> “ъ”, “y”=> “ы”, “‘”=> “ь”, “je”=> “э”, “ju”=> “ю”, “ja”=> “я”);
$ru_to_en = array(”а” => “a”, “б” => “b”, “в” => “v”, “г” => “g”, “д” => “d”, “е” => “e”, “ё” => “jo”,”ж” => “zh”,”з” => “z”, “и” => “i”, “й” => “j”, “к” => “k”, “л” => “l”, “м” => “m”, “н” => “n”, “о” => “o”, “п” => “p”, “р” => “r”, “с” => “s”, “т” => “t”, “у” => “u”, “ф” => “f”, “х” => “h”, “ц” => “c”, “ч” => “ch”, “ш” => “sh”, “щ” => “sch”, “ъ” => “#”, “ы” => “y”, “ь” => “‘”, “э” => “je”, “ю” => “ju”, “я” => “ja” );

if(preg_match(”/[а-я]/i”,$str)){$trans=$ru_to_en;}else{$trans=$en_to_ru;}
$res=strtr($str, $trans);
return $res;
}

Функция работает тупо до безобразия, если строка - кириллица, возвращает латиницу, и соответственно наоборот. Если проверять строку перед использованием функции посредством

preg_match(”/[а-я]/i”,$str)

можно запрещать-разрешать преобразование. Если строка содержит как латиницу, так и кириллицу - функция работать не будет. Для знаков отличных от алфавита, необходимо дополнить массивы $en_to_ru и $ru_to_en соответствующими парами значений. Пользуйтесь на здоровье

Рубрика: 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

Теги: , , ,