Загрузка записей в ExpressionEngine с помощью AJAX

Я ищу загружать записи из ExpressionEngine во всплывающем модале с помощью ajax-вызова с использованием jQuery, идея заключается в том, что пользователь нажимает на заголовок записи, который он откроет, показывая модальный номер с полной записью. Затем я хочу иметь следующую и предыдущую кнопку в модальном режиме, которые позволят мне перейти к следующей и предыдущей записи в всплывающем модале. Я не знаю, лучше ли загружать шаблон или фид, т.е. JSON, или если есть другой способ, я рад слышать.

Кто-нибудь пытался это сделать или знать, что может быть полезно. Я столкнулся с этой статьей, которая проливает свет на нее, http://spibey.com/blog/2011/11/using-partial-views-in-the-expressionengine-control-panel-for-ajax-requests-or-similar/

ОТВЕТЫ

Ответ 1

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

Я рекомендую иметь группу шаблонов для хранения ваших html-фрагментов. В этом случае было бы удобно разместить тело ввода и ссылки входа в один шаблон

ajax.group
    - single_entry.html

Тогда, в своем простейшем, в этом шаблоне у вас будет

<div id="entry-body">
    {exp:channel:entries channel="channel_name_here" entry_id="{segment_3}"}
        <h2>{title}</h2>
        {body}
    {/exp:channel:entries} 
</div>

<div id="entry-links">
    {exp:channel:next_entry}        
        <a href="{path='ajax/single_entry'}" class="next">Next</a>
    {/exp:channel:next_entry} 
    {exp:channel:prev_entry}
        <a href="{path='ajax/single_entry'}" class="prev">Previous</a>
    {/exp:channel:prev_entry}
</div>

Когда вы запрашиваете эти фрагменты с помощью ajax, обязательно передайте текущие entry_id или url_title в качестве сегмента URL-адреса, чтобы шаблон фрагмента загрузил нужные вам данные. Вы можете передать селектор в load(), чтобы захватить требуемый фрагмент html и загрузить его в соответствующий контейнер на своей странице. В самом простом, что-то вроде

$('#entry-container').load('ajax/single_entry/2 #entry-body');
$('#entry-links').load('ajax/single_entry/2 #entry-links');

где 2 - это entry_id записи, которую вы загружаете. См. http://api.jquery.com/on/

Наконец, вам понадобятся прослушиватели событий jQuery в следующей и предыдущей ссылках на запись, чтобы они запускали jQuery load() для загрузки следующей записи. Вот пример этого для ссылки .next.

$(document).on('click', '.next', function(event) {
    var url = $(this).attr('href');
    $('#entry-container').load(url); // load the html into your chosen DOM element
    event.preventDefault(); // prevent the browser from navigating to this page     
});

См. http://api.jquery.com/on/