Пример загрузки контента без перезагрузки страницы

Динамическая загрузка контента

• 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.