Статьи помеченные ajax
Пример загрузки контента без перезагрузки страницы
Динамическая загрузка контента
Блог - это лента из заголовков статей и нескольких строчек из них. Пусть так и останется, когда посетитель решит прочитать содержимое выбранной статьи. То есть вся лента останется и добавится контент выбранной статьи.
Редактирование и валидация модальной формы
Использование pop-up формы
Бывает, что количество полей в таблице не слишком велико и редактировать в модальном окне проще и нагляднее. Что необходимо, чтобы организовать стандартный набор операций - CReate, Update, Delete?
Поиск
Метки
Пример загрузки контента без перезагрузки страницы
Динамическая загрузка контента
- 1. Пример работы с сессией
- 2. Пример загрузки контента без перезагрузки страницы
- 3. Как определить и вызвать событие
Блог - это лента из заголовков статей и нескольких строчек из них. Пусть так и останется, когда посетитель решит прочитать содержимое выбранной статьи. То есть вся лента останется и добавится контент выбранной статьи.
Controller
Добавим в frontend\controllers\PostController.php
действие, загружающее контент.
public function actionGetContent($id) { echo $this->loadModel($id)->content; }
View
В представлении frontend/views/post/_view.php
, которое используется при выводе блога, добавим пустой блок для контента. Общая структура выглядит так:
<div class='post-preview'> <div class='post-title'> ... </div> <div class='post-excerpt'> ... </div> <div class='post-content'></div> <div class='post-meta'> ... <span class='read-more' data-post-id='<?= $model->id ?>'> <?=\Yii::t('app', 'read more') ?> </span> </div> </div>
В начале представления frontend/views/post/index.php
добавим кусок jQuery
кода, который и будет выполнять работу.
$script = <<< JS $('.read-more').on('click', function(e) { var that = $(this); var preview = that.closest('.post-preview'); var content = preview.find('.post-content'); var read_more = preview.find('.post-meta').find('.read-more'); $.ajax({ url: 'post/get-content', data: {id: that.attr('data-post-id')}, success: function(response) { content.hide(); content.html(response); read_more.hide(); content.show(); } }); }); JS; $this->registerJs($script);
Config
Стоит проверить url-маршруты в файле common/config/main.php
, чтобы вызов post/get-content
не вызывал проблем.
И это все?
Да, но есть проблема - "след" пользователя при динамической загрузке не сохраняется. "След" это список просмотренных постов (см. предыдущую заметку).
Просмотр поста посетителем - это событие. Так оно и должно быть определено. Но об этом в следующей статье.
Заключение
Реализация загрузки контента по требованию проще, чем GRUD. Может поэтому и появилось RESTful.
Оставить комментарий
Только авторизованные пользователи могут оставлять комментарии. Пожалуйста авторизуйтесь или пройдите регистрацию.
Можно авторизоваться, используя социальную сеть-
-
-
-