Sunday, May 06, 2012

Песочница для отладки Ajax запросов на jQuery

В рамках знакомства с jQuery я давно хотел руками написать простой клиентский обработчик Ajax ответа, содержащий JSON. А то нами уже реализовано море серверной логики, которая взаимодействует с клиентом по REST/JSON, а что происходит на клиенте непонятно :). Вот что получилось:

Прежде всего создал веб проект для Maven на Jetty 8.1.3.v20120416:


Далее положил примерчик JSON в виде текстового файлика testdata.txt в папку webapp/resources:
{
"Player1":[1,4]
}


Далее создал index.jsp в корне webapp:

Что здесь интересного
1. Функция jQuery ajax - описание здесь
2. Структура $(document).ready(function...) - определяем функцию, которая вызовется после загрузки странички
3. $("input").click(function...) - определяем действие по клику на кнопочку.

Самые пригодившиеся мне материалы для изучения 18-ти минутный туториал по jQuery. Не пожалел потраченных 18-ти минут аж никак :)
jQuery для начинающих по-русски. Хорошо, что по-русски и с примерами, достойная дока, но мне этого не хватило
Ajax/jQuery.getJSON Simple Example. Здесь много примерчиков для понимания, очень помогли.
Simple Long Polling Example with JavaScript and jQuery . Классная статься с примерами как организовать long polling, попробую чуть позже :)

2 comments:

  1. Я бы просто вебсервер поднял в папке с тестовыми json файлами.

    Если ты на юниксе, то можно поставить cs и up:
    https://github.com/n8han/conscript#readme
    и
    https://github.com/softprops/unplanned

    Запустить:
    curl https://raw.github.com/n8han/conscript/master/setup.sh | sh
    а потом установить up
    cs softprops/unplanned

    заходишь в папку с файлами
    cd your-json-folder
    up -p 9999

    ReplyDelete
    Replies
    1. Прикольно, спасибо, Леша, за совет.
      Поставил у себя на винде.

      1. скачал cs отсюда https://github.com/downloads/n8han/conscript/conscript-0.4.0.jar
      2. запустил java -jar conscript-0.4.0.jar
      3. и затем cs softprops/unplanned.
      Главное в PATH добавить папочку %USERPROFILE%\bin :)

      Delete