ruby-on-rails - rails : will_paginate "Show next 10" button?

Question

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

我希望分页表现得像 Facebook 新闻提要，而不是显示页码。也就是说，如果我当前在页面上显示 10 个项目，并且用户单击“下一步”按钮，则页面应该向下延伸，并且总共显示 20 个项目。我正在寻找修改 will_paginate 的方法gem 或使用 AJAX 来完成此操作。

Answer 1

按照这些在单击按钮时显示更多结果:

不要在 View 中使用 will_paginate 标签

单击“下一个”链接

使用 AJAX 获取下一组结果

以下代码将删除页码并仅显示下一个和上一个按钮:

<%= 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.绑定(bind)表单点击和AJAX提交的Javascript函数

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/