Silverstripe + Infinite Ajax Scroll:None Left不断添加到页面

时间:2014-06-18 16:48:01

标签: javascript php css silverstripe jquery-ias

我在silverstripe网站上运行了无限的ajax滚动。我还有“NoneLeft”扩展运行让人们知道,他们到了底部。

IAScroll在ArticleHolder页面中显示ArticlePages并显示“NoneLeft”文本。现在,当我直接显示一个ArticlePage(没有ArticleHolder)时,它也显示“NoneLeft”文本。 有没有办法将其关闭或限制到某个页面? 或者我是否必须从jQuery中取消绑定? 很多

Silverstripe ArticleHolder.php

<?php
class ArticleHolder extends Page {
    private static $allowed_children = array('ArticlePage');    
}

class ArticleHolder_Controller extends Page_Controller {

    public function PaginatedArticles(){
        $paginatedItems = new PaginatedList(ArticlePage::get()->sort("Date DESC"), $this->request); 
        $paginatedItems->setPageLength(4);
        return $paginatedItems;
    }   
}

的script.js

var ias = jQuery.ias({
          container:  '#posts',
          item:       '.post',
          pagination: '#pagination',
          next:       '.next',
          delay:        0,
          negativeMargin: 250,
          history: true; }
        });

        // Adds a text when there are no more pages left to load
        ias.extension(new IASNoneLeftExtension({
            text: "You reached the end" 
        }));

#pagination的html输出,当有几个帖子时

<div id="pagination" class="line" style="display: none;">
    <div class="unit size1of4 lineLeftRight lineLeft">
        <p></p>
    </div>
    <div class="unit size1of4 lineLeftRight lineLeft">
        <p> …
            <a class="next" href="?start=4"> Next
            </a>
        </p>
    </div>
    <div class="unit size1of4 lastUnit lineLeftRight lineRight">
        <p></p>
    </div>
</div>

当只有一篇文章时,没有#pagination而是“NoneLeft”文本

<div id="ias_noneleft_1403162234904" class="ias-noneleft line">
    <div class="unit size1of4 lineLeftRight lineLeft">
        <p></p>
    </div>
    <div class="unit size2of4 lineMiddle">
        <p>
            You reached the end
        </p>
    </div>
    <div class="unit size1of4 lastUnit lineLeftRight lineRight">
        <p></p>
    </div>
</div>

1 个答案:

答案 0 :(得分:0)

好吧,我找到了。 当显示单个ArticlePage时,我仍然在文章周围有一个div with class .post

<div class="post line">
// the article
</div>

只要无限ajax滚动看到.post div,就会添加noneLeft文本。 将.post class div移动到ArticleHolder的循环中有所帮助。

ArticleHolder.ss

<div id="posts" class="line">
        <% loop $PaginatedArticles %>
            <div class="post line">
            <% include ArticlePage %>
            </div>
        <% end_loop %>
</div>