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

Без перегрузки


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

Динамическая загрузка все чаще используется при создании сайтов. Динамическая загрузка позволяет обновлять контент частями. Разрабатываемый сайт выдает посетителю только то, что он запрашивает, оставляя остальную часть страницы без изменения.

Без перегрузки

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

Блог - это лента из заголовков статей и нескольких строчек из них. Пусть так и останется, когда посетитель решит прочитать содержимое выбранной статьи. То есть вся лента останется и добавится контент выбранной статьи.


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.

Оставьте комментарий

Только авторизованные посетители могут оставлять комментарии. Пожалуйста, войдите или пройдите регистрацию.