我正在寻找使用jQuery从一个弹出式模式中加载来自ExpressionEngine的条目,这个想法是当用户点击条目标题时,它将打开显示一个模式,其中包含完整的条目.我正在寻找一个下一个&模式上的上一个按钮,这将允许我移动到弹出窗体中的下一个和以前的条目.
我不知道最好加载模板或Feed,即 JSON,还是有其他方式我很高兴听到.
我不知道最好加载模板或Feed,即 JSON,还是有其他方式我很高兴听到.
有没有人试过这个,或者知道一个可能有帮助的tut.我已经看到这篇文章,它揭示了它,http://spibey.com/blog/2011/11/using-partial-views-in-the-expressionengine-control-panel-for-ajax-requests-or-similar/
解决方法
您链接到的教程是用于控制面板.由于您正在谈论前端的内容,您可以在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
});
