Ajax навігація що це таке сторінка 2 - блог розробника

У зв'язку з множинними питаннями щодо цього модуля, вирішив написати цю новину. Для роз'яснення що ж таке AJAX навігація і чому у деяких не хоче працювати. Також наведу деякі приклади і рішення деяких тривіальних завдань на прикладі даного сайту.

Отже основна інформація знаходиться в Вікіпедії.
AJAX, Ajax (від англ. Asynchronous j # 097; vascript and XML - «асинхронний j # 097; vascript і XML») - підхід до побудови призначених для користувача інтерфейсів веб-додатків, що полягає в «фоновому» обміні даними браузера з веб-сервером . В результаті, при оновленні даних, веб-сторінка не перезавантажується повністю, і веб-додатки стають швидшими і зручнішими. Т. е. Елементи сторінки DOM (об'єктна модель документ) вже сформовані, і при AJAX ми лише змінюємо вміст сторінки. З нерозумінням даного факту, в основному, і виникають проблеми під час налаштування модуля.

Поясню що ж відбувається при оновленні сторінки. Java Script Скрипт отримує дані від PHP про зміст запитуваної сторінки з урахуванням даних в mainajax.tpl, і замінює на сторінці всередині (елемент з id рівним dle-content).

Основна проблема - з недонастройкой шаблонів, у яких використовується aviable.
Приклад недонастроенного коду:

Результат - контент не змінюється, через що? Через те що немає елемента dle-content, т. К. Він прописаний всередині.
Як виправити? Потрібно його прописати таким чином (причому не тільки в main.tpl, але і в mainajax.tpl)
main.tpl


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

Отже main.tpl - Необхідно обернути теги в елементи DOM


і в mainajax.tpl робимо так

В результаті отримуємо: На головній немає speedbar, але на інших він є

З'явився нових тег - цей тег працює тільки в такій конструкції: $ (.) .html ( ''); - також можна зробити і для інших блоків -,,, і тп. Однак також можна використовувати і звичайні теги,,, і тп.

Трохи складніше з слайдерами, в основному структура така:

Отже перший рядок необхідно вставити в main.tpl, т. К. Потрібно завантажити функції слайдера. А ось другий рядок необхідно описати в main.tpl і в mainajax.tpl, т. К. Ми переініціалізуем роботу слайдера. Наприклад так:
У main.tpl

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


Тепер нововведення - AJAX навігація форм: Т. к. Не для всіх форм на сайті можливо реалізувати AJAX навігацію - їх необхідно вказувати Самум вручну, робиться це в main.tpl так:


Але можна зробити простіше:


І протестувати всі форми - які не схожі виключити так

фітчи:
Як змінити вміст вікна прогресу?
в main.tpl вставляємо таке

Схожі статті