Наша совместная команда Banwar.org

Связаться с нами

  • (097) ?601-88-87
    (067) ?493-44-27
    (096) ?830-00-01

Статьи

Розуміння Zend Framework, Частина 9: Додавання інтерактивності за допомогою Ajax і JSON

  1. Серія контенту:
  2. Цей контент є частиною серії: Розуміння Zend Framework, Частина 9
  3. Як ми тут опинилися
  4. Отже, що ж таке Ajax і JSON?
  5. Лістинг 1. Створення об'єкта
  6. розбиття запитів
  7. Лістинг 2. amazonView.php
  8. Лістинг 3. flickrView.php
  9. Оновлення загального перегляду
  10. Лістинг 4. Спрощення viewSearchResults.php
  11. Лістинг 5. Оновлення FeedController.php
  12. Малюнок 1. Оброблені результати
  13. Створення нових посилань
  14. Лістинг 6. Переміщення вмісту з посиланнями
  15. Малюнок 2. Відображення нових посилань
  16. Лістинг 7. Додавання нового дії в FeedController.php
  17. Малюнок 3. Перегляд нового дії mashup
  18. Додавання Ajax
  19. Лістинг 8. Додавання Ajax до viewSearchResults.php
  20. Малюнок 4. Результат Ajax
  21. Лістинг 9. Створення об'єктного запиту JavaScript
  22. Малюнок 5. Текст JSON
  23. Лістинг 10. Введення тексту JSON в mashupAction ()
  24. Лістинг 11. Створення класів Amazon
  25. Лістинг 12.Создание об'єктів результату Amazon
  26. Малюнок 6. Повернений текст JSON
  27. Лістінг 13. Управління последнего відповіддю
  28. Висновок
  29. Ресурси для скачування

Розуміння Zend Framework, Частина 9

Серія контенту:

Цей контент є частиною # з серії # статей: Розуміння Zend Framework, Частина 9

https://www.ibm.com/developerworks/ru/views/global/libraryview.jsp?series_title_by=Понимание+zend+framework,+Часть+9

Слідкуйте за виходом нових статей цієї серії.

Цей контент є частиною серії: Розуміння Zend Framework, Частина 9

Слідкуйте за виходом нових статей цієї серії.

В восьмий частини цієї серії ми додавали результати Yahoo !, Amazon і Flickr в додаток Chomp. Тепер ми збираємося вдосконалити програму, завантажуючи тільки ті дані, які запросив користувач, і тільки коли він запросив. Але спочатку давайте подивимося, де ми знаходимося.

Як ми тут опинилися

Ця дев'ята стаття з серії " jsp?search_by=zend+framework> Розуміння Zend Framework "- одна з частин хронології створення онлайнової програми для читання стрічок, Chomp, що пояснює основні аспекти використання вже згадуваного продукту з відкритим вихідним кодом - PHP Zend Framework.

В першій частині ми говорили про основні поняття Zend Framework, включаючи список релевантних класів і обговорення шаблону MVC (Model-View-Controller). під другій частині ми показали, як МVC працює в додатку Zend Framework. Також ми здійснювали реєстрацію користувачів і процес входу в систему, додаючи інформацію про користувача в базу даних і витягуючи її назад.

У частинах 3 і 4 ми мали справу з фактичним RSS- і Atom-стрічками. В третій частині ми показували користувачам, як підписуватися на індивідуальні стрічки і відображати елементи даних зі списків в цих стрічках. Ми також обговорювали деякі можливості Zend Framework по обробці форми, контролю даних і відбору елементів даних стрічки. частина 4 пояснює, як створювати Proxy-сервер для отримання даних з сайту, який не має стрічку.

Інші статті даної серії вносять додатковий внесок у додаток Chomp. частина 5 пояснює, як використовувати модуль Zend_PDF, щоб користувач міг створювати свій власний PDF-файл збережених статей, картинок і здійснювати пошук. В шостої частини ми використовували модуль Zend_Mail для сповіщення користувачів про нові повідомлення. В сьомий частини ми здійснювали пошук по збереженим документам і отримували впорядковані результати. В восьмий частини ми додавали додаткові розміри нашому reader-у, пов'язуючи ресурси Amazon.com, Yahoo! і Flickr з нашим поточним додатком, для створення надійного mashup - додатки, що об'єднує дані декількох джерел.

В останній статті серії ми будемо використовувати Ajax і компонент Zend Framework - Zend_Json, щоб автоматично оновити частину сторінки пошуку з певної запитуваною інформацією.

Отже, що ж таке Ajax і JSON?

Зазвичай люди бродять по інтернету, вибираючи посилання в пошуках додаткової інформації. У більшості випадків вся сторінка заміщається іншою або перезавантажується, навіть якщо більша частина відображуваного на сторінці не змінюється. Проте, заміщення відбувається.

В основному немає необхідності в заміщенні всієї сторінки, коли ви всього лише хочете оновити рядок. Замість цього більш зручним було б залишити сторінку на місці і просто додати або змінити інформацію, яка вже є. Для цього розробники використовують комбінацію HTTP, JavaScript і іноді XML. Це програмне mashup використовувалося у відносній неясності процесу в перебігу багатьох років. Проте, йому присвоїли ім'я Ajax (Asynchronous JavaScript і XML) і він став феноменом. Процес Ajax змушує браузер відсилати запити HTTP в фоновому режимі. Коли він отримує дані, він додає їх на сторінку, зазвичай в якості div елементу.

Тепер про XML. У загальному і цілому добре підходить для запитів Web-сервера, XML не завжди добре відображається в браузері. Виявляється, усередині JavaScript об'єкти представлені як прості рядки, які ми можемо самі створювати і дешифрувати вручну. Наприклад, погляньте на об'єкт нижче, який ви можете створити самостійно.

Лістинг 1. Створення об'єкта
var theFeed = new Object (); theFeed.title = "Chaos Magnet"; theFeed.url = "http://feeds.feedburner.com/ChaosMagnet";

Замість цього рядка може бути представлена ​​інша - рядок JSON, показана нижче.

{ "Title": "Chaos Magnet", "url": "http://feeds.feedburner.com/ChaosMagnet"}

Може здатися, що це не дуже просто, проте постарайтеся осмислити той факт, що практично кожна мова програмування має цілий алгоритм перекладу своїх рідних об'єктів в таку форму. А ця можливість дозволяє створювати об'єкт JavaScript, відсилати його як рядок JSON в алгоритм PHP, який переводить її в рідній об'єкт PHP. Об'єкт PHP потім переводиться назад в рядок JSON, який повертається як результат Web-сервера в мову JavaScript, який перетворює його знову в рідній об'єкт JavaScript.

Ми можемо навіть посилати і повертати ці рядки в якості запитів Ajax. Але спочатку нам потрібно зробити невелику реструктуризацію додатки Chomp.

розбиття запитів

Отже, коли користувач виконує пошук, дія viewSearchResults в FeedController не тільки створює пошукові результати як такі, але також виконує запит в сервіси Amazon і Flickr і вбудовує їх в загальний перегляд. Одна з проблем, пов'язаних з цим, - затримка результату, тому що запити в Web-серверах рідко виконуються швидко. І якщо розмістити два запити на одній сторінці, можна дійсно сильно уповільнити процес виконання.

Насамперед при створенні запиту Ajax потрібно розбити його на окремі складові. Наприклад, ми можемо перемістити результати Amazon і Flickr із загального перегляду, viewedSearchResults.php, в їх власні файли, amazonView.php і flickrView.php.

Лістинг 2. amazonView.php
<H4> Ви шукали якісь книги? &lt;/ H4> <ol&gt; <? Php foreach ($ this-> amazonHits as $ result) {echo "<li> <img src = '". $ Result-> SmallImage-> Url-> getUri (). " 'Width ='". $ Result-> SmallImage-> Width. " 'Height ='". $ Result-> SmallImage-> Height. " '/>"; echo "<a href = '". $ Result-> DetailPageURL. " 'Title ='". htmlentities ($ result-> Title, ENT_QUOTES). "At Amazon.com '>"; echo "<strong>". htmlentities ($ result-> Title). &quot;</ Strong> </a>"; echo "(Ranked #". $ result-> SalesRank. ") </ li>"; }?> </ Ol>

Це той же код, що був при загальному перегляді. Ми просто пересунули його в окремий файл. Проробимо те ж саме з результатами Flickr (див. Лістинг 3).

Лістинг 3. flickrView.php
<Table> <caption> Фотографії від <a href="http://flickr.com/"> Flickr </a> </ caption> <tbody&gt; <? Php foreach ($ this-> flickrHits as $ index => $ result) {// Починаємо колонку (column) if ($ index% $ this-> columns == 0) {echo '<tr>'; } $ Thumbnail = '<img src = "'. $ Result-> Square-> uri. '" Width = "75" height = "75" />'; echo '<td> <a href="'. $result-> Large-> clickUri.' "title =" to Flickr "> '. $ Thumbnail. '</a> <br />'; echo '<small> by <a href="http://www.flickr.com/photos/'. $this-> escape ($ result-> ownername).' "title =" Owner "> '. htmlentities ($ result-> ownername). '</a> on'. $ Result-> datetaken. '&lt;/ Small> </ td>'; // Закриваємо колонку if ($ index% $ this-> columns == $ this-> columns - 1) {echo '</ tr>'; }}?> </ Tbody> </ table>

Розмістимо обидва файли (amazonView.php і flickrView.php) в директорії перегляду.

Оновлення загального перегляду

Звичайно, ми не хочемо втратити ці файли. Навпаки, нам потрібно отримати результати виконання окремих переглядів. Ми можемо зробити це, включивши виконаний текст так само, як будь-які інші дані.

Лістинг 4. Спрощення viewSearchResults.php
... $ title = $ feedTitle; if ($ channelTitle! = '') $ title = "$ title> $ channelTitle"; echo "<tr> <td> #". $ I ++. &quot;: </ Td>"; echo "<td> <a href=\"$url\"> $ title </a> </ td>"; echo "<td> $ score </ td> </ tr>"; }?&gt; </ Table&gt; <? Php echo ($ this-> renderedAmazon)?&gt; <? Php echo ($ this-> renderedFlickr)?> </ Body> </ html>

Щоб зробити ці дані доступними, потрібно оновити FeedController.

Лістинг 5. Оновлення FeedController.php
public function viewSearchResultsAction () {... $ view = Zend :: registry ( 'view'); $ View-> title = "Search Results for: $ query"; $ View-> hits = $ hits; $ AmazonView = Zend :: registry ( 'view'); require_once 'Zend / Service / Amazon / Query.php'; $ Key = 'YOUR_AMAZON_KEY_HERE'; $ AmazonQuery = new Zend_Service_Amazon_Query ($ key); $ AmazonQuery-> Category ( 'Books') -> Keywords ($ filterGet-> getRaw ( 'query')) -> ResponseGroup ( 'Medium'); $ AmazonView-> amazonHits = $ amazonQuery-> search (); $ View-> renderedAmazon = $ amazonView-> render ( 'amazonView.php'); $ FlickrView = Zend :: registry ( 'view'); $ Key = 'f50c3c5b6384493f20e69b70b9ff7d29'; $ FlickrQuery = new Zend_Service_Flickr ($ key); $ Tags = explode ( '', $ filterGet-> getRaw ( 'query')); $ FlickrView-> flickrHits = $ flickrQuery-> tagSearch ($ tags); $ View-> renderedFlickr = $ flickrView-> render ( 'flickrView.php'); echo $ view-> render ( 'viewSearchResults.php'); }

Тепер створимо два нових зорових об'єкта і узгодимо їх з даними, попередньо відправленими в основний перегляд. Цей процес просто представляє текст, тому ми можемо встановити отриманий текст як атрибут основного перегляду.

В результаті повинна з'явитися сторінка, яка в точності повторює малюнок 1.

Малюнок 1. Оброблені результати

Різниця в тому, що тепер ми можемо управляти окремими частинами даних.

Створення нових посилань

Наступним кроком буде спільне видалення даних з основного перегляду і переміщення їх разом з посиланнями, якими ми можемо при необхідності скористатися. Щоб це виконати, змініть файл viewedSearchResults.php так, як показано нижче.

Лістинг 6. Переміщення вмісту з посиланнями
... echo "<tr> <td> #". $ I ++. &quot;: </ Td>"; echo "<td> <a href=\"$url\"> $ title </a> </ td>"; echo "<td> $ score </ td> </ tr>"; }?> </ Table> <center> <p> <a href="javascript:getMashup('amazon')" target="_blank"> Show related books </a> | <a href="javascript:getMashup('flickr')" target="_blank"> Show related photos </a> </ p> </ center> </ body> </ html>

Ці посилання ще не активні. Скоро ми створимо функцію getMashup (), при перезавантаженні пошукової сторінки ви побачите результат, відображений на малюнку 2.

Малюнок 2. Відображення нових посилань

Створення нового дії mashup

Перед тим, як створити функцію JavaScript, яка проситиме нові дані, ми повинні створити дію, яке JavaScript викликатиме. В даному випадку ми створюємо нову дію, mashupAction, яке підтримує тип mashup і запити і повертає відповідні дані, як показано нижче.

Лістинг 7. Додавання нового дії в FeedController.php
... public function viewSearchResultsAction () {... $ view = Zend :: registry ( 'view'); $ View-> title = "Search Results for: $ query"; $ View-> hits = $ hits; $ View-> query = $ query; echo $ view-> render ( 'viewSearchResults.php'); } Public function mashupAction () {$ filterGet = Zend :: registry ( 'fGet'); $ Type = $ filterGet-> getRaw ( 'type'); if ($ type == 'amazon') {$ amazonView = Zend :: registry ( 'view'); require_once 'Zend / Service / Amazon / Query.php'; $ Key = 'YOUR_AMAZON_KEY_HERE'; $ AmazonQuery = new Zend_Service_Amazon_Query ($ key); $ AmazonQuery-> Category ( 'Books') -> Keywords ($ filterGet-> getRaw ( 'query')) -> ResponseGroup ( 'Medium'); $ AmazonView-> amazonHits = $ amazonQuery-> search (); echo $ amazonView-> render ( 'amazonView.php'); } If ($ type == 'flickr') {$ flickrView = Zend :: registry ( 'view'); $ Key = 'YOUR_FLICKR_KEY_HERE'; $ FlickrQuery = new Zend_Service_Flickr ($ key); $ Tags = explode ( '', $ filterGet-> getRaw ( 'query')); $ FlickrView-> flickrHits = $ flickrQuery-> tagSearch ($ tags); echo $ flickrView-> render ( 'flickrView.php'); }} ...

По-перше, відзначимо, що ми видаляємо зайву інформацію з viewSearchResultsAction. По-друге, ми створюємо mashupAction, яке підтримує два параметри з використанням фільтром GET: type і query. Залежно від типу type дію забезпечує перегляд Amazon або Flickr.

Ви можете переглянути цю дію, вказавши місцезнаходження вашого браузера в http: // localhost / feed / mashup? Type = flickr & query = pentagon або URL з тим же запитом. Результат повинен бути схожий на малюнок 3.

Малюнок 3. Перегляд нового дії mashup

Також ви можете змінити параметр type на amazon, щоб побачити інші дані. Ми включимо ці дані в сторінку результату пошуку, але тільки при необхідності.

Тепер можна почати додавання Ajax до нашого додатком.

Додавання Ajax

Процес додавання Ajax на сторінку завжди був болісним. Одних тільки відмінностей в браузерах було досить, щоб відлякати багатьох розробників. На щастя, цей процес був спрощений появою деяких безкоштовних інструментів. У нашій статті ми будемо використовувати Prototype Framework. Завантажте "простий JavaScript" з http://prototype.conio.net/ і збережіть файл у кореневому документі Web-сервера. На момент написання статті останньою версією є 1.4.0.

Ми можемо використовувати цю бібліотеку, включивши її на сторінку і залишивши посилання до об'єкту Ajax, як показано нижче.

Лістинг 8. Додавання Ajax до viewSearchResults.php
<Html> <head> <script src = "/ prototype.js"> </ script> <title&gt; <? Php echo $ this-> escape ($ this-> title); ?> </ Title> <script type = "text / javascript"> function getMashup (mashupType) {var url = 'http: // localhost / feed / mashup'; var myAjax = new Ajax.Request (url, {method: 'get', parameters: 'type =' + mashupType + '& query = <? php echo $ this-> query?>', onSuccess: renderResults}); } Function renderResults (response) {var renderDiv = document.getElementById ( 'mashupResults'); renderDiv.innerHTML = response.responseText; } </ Script> </ head> <body> [<a href='/'> Back to Main Menu </a>] <br> <h1&gt; <? Php echo $ this-> escape ($ this-> title); ?> </ H1> ... <center> <p> <a href="javascript:getMashup('amazon')"> Show related books </a> | <a href="javascript:getMashup('flickr')"> Show related photos </a> </ p> </ center> <div id = "mashupResults"> </ div> </ body> </ html>

Спочатку ми додаємо бібліотеку на сторінку. (Ми перейменували її на prototype.js для зручності.) Установка бібліотеки в кореневому документі дозволяє нам посилатися на неї, не захаращуючи код її дійсним місцезнаходженням.

Далі ми створюємо функцію getMashup (), яка створює новий запит Ajax.Request. Атрибутом цього запиту є адреса URL - зауважте, що це дію mashup для FeedController - і ряд параметрів, включаючи вибір методу (GET або POST), параметри, що посилаються із запитом, і дії JavaScript для виконання запиту, коли він повертається.

В даному випадку функція renderedResults () приймає запит HTTP як параметр. Ця функція просто отримує посилання до нового div-елементу mashupResults, який ми додаємо, і встановлює вміст як текст відповіді.

Так як цей текст в HTML, користувач може вибрати одну з посилань і побачити результат додавання на сторінці, як показує малюнок 4.

Малюнок 4. Результат Ajax

Додавання JSON

Цей процес став простіше, ніж був раніше. Насправді він і був абсолютно простим. Єдина складність тут - це те, що, по суті, в браузері виникає один великий текстовий фрагмент. Тепер це вже не має значення, оскільки ми відображаємо це все на одній сторінці, але в більшості випадків такий результат небажаний. Отже, перед тим як закінчити, подивимося, як можна по-іншому вирішити проблему із запитами: JSON.

Почнемо з JavaScript. Замість відсилання параметрів запиту mashup як пар імен, ми створимо об'єкт JavaScript, в який включимо ці пари як атрибути.

Лістинг 9. Створення об'єктного запиту JavaScript
<Html> <head> <script src = "/ prototype.js"> </ script> <script src = "/ json.js"> </ script> <title&gt; <? Php echo $ this-> escape ($ this-> title); ?> </ Title> <script type = "text / javascript"> function getMashup (mashupType) {var requestObject = new Object (); requestObject.type = mashupType; requestObject.query = '<? php echo $ this-> query?>'; var jsonRequest = requestObject.toJSONString (); alert (jsonRequest); var url = 'http: // localhost / feed / mashup'; var myAjax = new Ajax.Request (url, {method: 'get', parameters: 'request =' + escape (jsonRequest), onSuccess: renderResults}); } ...

Ми додаємо другу бібліотеку, доступну на http://www.json.org/js.html . Ця бібліотека додає дві нові функції в JavaScript: toJSONString () і parseJSON ().

Далі створюємо простий об'єкт і встановлюємо значення його атрибутів. Як і раніше, цей запит закодований процесом перегляду PHP. Ми можемо безпосередньо звернутися до цього об'єкта, рядку JSON, і додати його до запиту як параметр. Якщо ми відображаємо у текстовому вікні, то це повинно виглядати так, як показано на малюнку 5.

Малюнок 5. Текст JSON

Потім ми повинні оновити метод mashupAction (), щоб він відповідав новим даними.

Лістинг 10. Введення тексту JSON в mashupAction ()
... public function mashupAction () {$ filterGet = Zend :: registry ( 'fGet'); $ Request = $ filterGet-> getRaw ( 'request'); $ RequestObject = Zend_Json :: decode ($ request, Zend_Json :: TYPE_OBJECT); $ Type = $ requestObject-> type; $ Query = $ requestObject-> query; if ($ type == 'amazon') {$ amazonView = Zend :: registry ( 'view'); require_once 'Zend / Service / Amazon / Query.php'; ...

Замість того, щоб розділяти запит по атрибутам type і query, ми вирізаємо один рядок з тексту, $ request, і, використовуючи компонент Zend_Json, перетворюємо його в рідній об'єкт PHP. (Якщо ви відкинете другий параметр методу decode (), то, швидше за все, замість об'єкта з'явиться матриця). Потім ми можемо вирізати атрибути type і query так само, як і атрибути інших об'єктів PHP.

Повернення об'єкта JSON виявляється не такою вже й простим завданням, але не через складність технології. Компонент Zend_JSON також включає метод encode (), тому ми можемо зробити так:

echo Zend_Json :: encode ($ amazonQuery-> search ());

Цей процес відбувається - надаються результати JSON - але процес цей, на жаль, недостатньо глибокий. Наприклад, об'єкт, що отримується в результаті, ставиться адресою URI малюнка, але не до атрибуту url. У багатьох випадках це не проблема, але так як об'єкт відповіді Amazon занадто складний, ми не будемо просто вибирати інформацію, необхідну нам для створення власного об'єкта.

Почнемо зі створення класів Amazon, як показано нижче.

Лістинг 11. Створення класів Amazon
class AmazonResults {public $ results = array (); } Class AmazonResult {public $ salesrank = null; public $ imgUri; public $ imgWidth; public $ imgHeight; public $ detailPage; public $ title; public $ salesRank; }

Додайте ці класи в будь-якому зручному місці. З точки зору PHP ви могли б розмістити ці класи в файлі FeedController.php (крім опису класу, зрозуміло), але з точки зору Zend Framework, ви можете розмістити їх в директорії моделі, яка знаходиться в тому ж місці, що і контролер, і зображення.

Ці класи не несуть ніяких функцій; вони існують лише для забезпечення імені об'єктів, які вони представляють. Ми можемо створити анонімні об'єкти, але ви опинитеся в скруті, коли спробуєте знайти окремі об'єкти, що відносяться до одного рядка JSON.

А тепер ми можемо створити власні об'єкти, як показано нижче.

Лістинг 12.Создание об'єктів результату Amazon
... if ($ type == 'amazon') {require_once 'Zend / Service / Amazon / Query.php'; $ Key = 'YOUR_AMAZON_KEY_HERE'; $ AmazonQuery = new Zend_Service_Amazon_Query ($ key); $ AmazonQuery-> Category ( 'Books') -> Keywords ($ query) -> ResponseGroup ( 'Medium'); $ ResponseObject = new AmazonResults (); foreach ($ amazonQuery-> search () as $ result) {$ resultObject = new AmazonResult (); $ ResultObject-> imgUri = $ result-> SmallImage-> Url-> getUri (); $ ResultObject-> imgWidth = $ result-> SmallImage-> Width; $ ResultObject-> imgHeight = $ result-> SmallImage-> Height; $ ResultObject-> detailPage = $ result-> DetailPageURL; $ ResultObject-> title = htmlentities ($ result-> Title); $ ResultObject-> salesRank = $ result-> SalesRank; array_push ($ responseObject-> results, $ resultObject); } Echo Zend_Json :: encode ($ responseObject); } If ($ type == 'flickr') {$ key = 'YOUR_FLICKR_KEY_HERE'; ...

Перш за все, створіть загальний об'єкт, як приклад для класу AmazonResults. Зробіть це для кожного результату пошуку, виділяючи з кожного необхідну нам інформацію і додаючи її до нового об'єкту AmazonResult. Кожен з об'єктів результату додається до масиву результатів нового об'єкта. Ми можемо закодувати об'єкт і відправити його назад в браузер.

Зараз сторінка просто відображає будь-який рядок, яку ми відсилаємо назад. Якщо ви виконуєте запит, то можете побачити реальний текст JSON на сторінці, як це показано на малюнку 6.

Малюнок 6. Повернений текст JSON

Все, що нам потрібно зробити зараз, - це налаштувати функцію renderResults (), щоб вона сполучалася з об'єктом під час відправки.

Лістінг 13. Управління последнего відповіддю
... function renderResults (response) {var responseObject = response.responseText.parseJSON (); var outputString = '<ol>'; for (i = 0; i <responseObject.results.length; i ++) {thisResult = responseObject.results [i]; outputString + = '<li> <img src = "' + thisResult.imgUri; outputString + = '" width = "' + thisResult.imgWidth; outputString + = '" height = "' + thisResult.imgHeight + '" /> '; outputString + = '<a href="' + thisResult.detailPage +'">'; outputString + = '<strong>' + thisResult.title + '</ strong> </a>'; outputString + = '(Ranked #' + thisResult.salesRank + ') </ li>'; } OutputString + = '</ ol>'; var renderDiv = document.getElementById ( 'mashupResults'); renderDiv.innerHTML = outputString; } ...

Спочатку ми повінні отріматі ПОСИЛАННЯ до реального об'єкту. Для цього нужно застосуваті метод parseJSON () до тексту ВІДПОВІДІ. Отримав об'єкт, Ми можемо Керувати ним, як и будь-Якім іншім об'єктом в JavaScript. В даному випадку ми формуємо висновок результатів. Щоб зробити це, ми повинні переглядати масив результатів кожен раз при отриманні посилання до окремого елементу і його атрибутів. Досліджуючи кожен результат, ми просто виводимо його на сторінку, як і раніше.

При цьому ми використовуємо той же HTML, який використовували до цього, але важлива відмінність в тому, що, якщо б ми захотіли, ми б могли інформацію в скрипті використовувати по-різному.

Висновок

Таким чином, ми підійшли до завершення нашого проекту. У цій серії, почавши з нуля, ми змогли спростити використання процесу створення інтерактивного Chomp! -Reader'а за допомогою Zend Framework. Ця програма виконує звичайні завдання в інтернеті, такі як обробка форми, а також менш традиційні завдання, як, наприклад, інтерпретація стрічок RSS і Atom, і ще менш звичні завдання - динамічна генерація файлів PDF.

Звичайно, додаток само по собі не закінчено. Ми створили тільки основу, кістяк, в який потрібно вдихнути життя за допомогою графічного дизайну, можливої ​​зміни (або навіть повторного зміни) бази даних і деяких сучасних деталей, таких як здатність динамічного додавання нової форми, яка не існує в поточному режимі роботи системи.

Але, не дивлячись ні на що, процес був цікавим і дуже продуктивним - він зажадав набагато менше роботи завдяки використанню Zend Framework. Сама система Zend Framework теж змінюється і розширюється. На той час як ви прочитаєте цю статтю, система поповниться функціональними нововведеннями, які полегшать її використання.

Ресурси для скачування

Схожі тими

  • Оригінал статті " Understanding the Zend Framework, Part 9: Adding interactivity with Ajax and JSON . "
  • Ця серія починається зі статті " Розуміння Zend Framework, Частина 1: Основи . "
  • завантажте Zend Framework .
  • Web-сайт Zend Framework містіть останні документації , А такоже FAQ про інсталяції .
  • завантажте PHP V5.x з PHP.net .
  • " Ajax RSS reader , "Покаже вам, скільки часу заощадить використання Zend Framework, порівняйте з RSS-reader'ом, створеним в PHP.
  • завантажте Prototype Framework для полегшення роботи з Ajax.
  • Отримайте більше інформації на JavaScript Object Notation (JSON) або завантажте реалізацію JavaScript .
  • Розробники Java обов'язково повинні подивитися " Ajax для розробників Java: спеціалізація об'єктів Java для Ajax . "
  • Розробник Кріс Лаффре ділиться цікавими ідеями та експериментальними досягненнями в області Ajax і mashup в статті " Розгляд Ajax, Частина 2: Змініть ваше життя з mashup . "
  • Поглиблена дискусія з приводу сесійного архітектури - " Ресурсно-орієнтовані проти орієнтованих на роботу Web-сервісів . "
  • " Розуміння спеціалізації Web-сервісів, Частина 1 "Пропонує огляд SOAP, серверів SOAP і користувачів SOAP.
  • Чому б не переглянути сайти, на яких є послуги, що описуються в нашій статті? База даних книг і роздрібних товарів Amazon , Розцінки на Yahoo! і якісні фотографії на Flickr - в наявності для будь-якого досвідченого користувача.
  • Щоб краще зрозуміти цілі проекту reader'а для стрічок, прочитайте статтю " Введення в Синдикати, (RSS) Really Simple Syndication , ", Написану Вінсентом Луріей.
  • Обов'язково Ознайомтеся з Керівництвом по Zend Framework .
  • доступний ресурс Посилання функцій PHP .
  • Бурхливі роздуми про ModelViewController пояснює значення MVC, а також полеміку, що виникла навколо цієї системи.
  • Web-сайт phpPatterns розглядає MVC з точки зору PHP .
  • перегляньте відео файл , Який пояснює, як встановити Apache і PHP.
  • відвідайте проекти PHP IBM developerWorks, щоб дізнатися більше про PHP.
  • Відвідайте розділ developerWorks Open source для отримання більш докладної інформації, інструментальних засобів і оновлених проектів, які представлені з відкритим вихідним кодом і використовуються в IBM.
  • Цікаві для розробників програмного забезпечення інтерв'ю та обговорення дивіться на developerWorks podcasts .
  • Доповніть ваш дослідницький проект open source за допомогою пробних комп'ютерних програм IBM , Доступних для завантаження і на DVD.

Підпішіть мене на ПОВІДОМЛЕННЯ до коментарів

Jsp?
Отже, що ж таке Ajax і JSON?
Lt;/ H4> <ol> <?
Quot;</ Strong> </a>"; echo "(Ranked #". $ result-> SalesRank. ") </ li>"; }?
Com/"> Flickr </a> </ caption> <tbody> <?
Lt;/ Small> </ td>'; // Закриваємо колонку if ($ index% $ this-> columns == $ this-> columns - 1) {echo '</ tr>'; }}?
Quot;: </ Td>"; echo "<td> <a href=\"$url\"> $ title </a> </ td>"; echo "<td> $ score </ td> </ tr>"; }?
Gt; </ Table> <?
Php echo ($ this-> renderedAmazon)?
Gt; <?

Новости

Banwar.org
Наша совместная команда Banwar.org. Сайт казино "Пари Матч" теперь доступен для всех желающих, жаждущих волнения и азартных приключений.