Question

我在rails 3 app上使用will_paginate gem。现在，它正确分页，并显示列表底部的所有页码，以及上一个和下一个按钮。

我希望分页的行为与Facebook新闻Feed一样，而不是显示页码。也就是说，如果我当前在页面上显示10个项目，并且用户单击“下一个”按钮，则页面应向下延伸，并且总体上显示20个项目。我正在寻找一种方法来修改will_paginate gem或使用AJAX来实现这一目标。

Answer 1

按照以下步骤点击按钮显示更多结果：

请勿在视图中使用will_paginate标记
点击“下一步”链接

以下代码将删除页码，只显示next和prev按钮：

<%= will_paginate @posts, :page_links => false %>

您可以找到更多用于分页的样式here

使用示例AJAX编辑：

1.创建一个页码为隐藏字段的表单

<%= form_tag url, :id => :filter, :method => :get do%>
    <%= hidden_field_tag :page, page %>
<% end %>

2.为“更多”添加范围

<span class='more-results' >More</span>

3.Javascript函数用于绑定表单的点击和AJAX提交

function  bindMoreResults() {
    jQuery("span.more-results").unbind("click");
    jQuery("span.more-results").click(
        function(e){
            e.preventDefault();
            getMoreResults();
        });
}

function getMoreResults() {
    jQuery('span.more-results').hide();
    var page_value = parseInt(jQuery("form#filter #page").val()) + 1;
    jQuery("form#filter #page").val(page_value);
    var form = jQuery("form#filter");
    jQuery.getJSON(
        form.attr("action") + ".json",
        form.serialize(),
        appendData
    );
}

function appendData(data) {
    jQuery('span.more-results').show();
//parse the data and append it
}

4.相应地修改appendData。点击此处查看有关getJSON的更多信息：http://api.jquery.com/jQuery.getJSON/

Rails：will_paginate“显示下一个10”按钮？

1 个答案: