我will_paginate
在我的项目中使用 gemROR
来显示页面中的记录。
我希望加载下一页而不使用重新加载整个页面ajax
。
我在网上找到了一些例子,但它们对我不起作用。
这个怎么做?
我will_paginate
在我的项目中使用 gemROR
来显示页面中的记录。
我希望加载下一页而不使用重新加载整个页面ajax
。
我在网上找到了一些例子,但它们对我不起作用。
这个怎么做?
创建一个具有以下内容的新助手(例如 app/helpers/will_paginate_helper.rb):
module WillPaginateHelper
class WillPaginateJSLinkRenderer < WillPaginate::ActionView::LinkRenderer
def prepare(collection, options, template)
options[:params] ||= {}
options[:params]['_'] = nil
super(collection, options, template)
end
protected
def link(text, target, attributes = {})
if target.is_a? Fixnum
attributes[:rel] = rel_value(target)
target = url(target)
end
@template.link_to(target, attributes.merge(remote: true)) do
text.to_s.html_safe
end
end
end
def js_will_paginate(collection, options = {})
will_paginate(collection, options.merge(:renderer => WillPaginateHelper::WillPaginateJSLinkRenderer))
end
end
然后在您的视图中使用此标签进行 ajax 分页:
<%= js_will_paginate @recipes %>
请记住,分页链接将包含 url 的现有参数,您可以排除这些,如下所示。这是标准的分页功能:
<%= js_will_paginate @recipes, :params => { :my_excluded_param => nil } %>
希望能解决您的问题。
更新 1 :在我发布此解决方案的原始问题中添加了有关其工作原理的说明。
更新 2:我已使其 Rails 4 与 remote: true 链接兼容,并将辅助方法重命名为js_will_paginate。
嘿,如果您想对产品进行分页,请尝试以下操作:
应用程序/控制器/products_controller.rb
def index
@products = Product.paginate(page: params[:page], per_page: 10)
end
意见/产品/index.html.erb
<div class = "sort_paginate_ajax"><%= render 'products' %></div>
意见/产品/_products.html.erb
<% @products.each do |product| %>
# your code
<% end %>
<%= will_paginate @products %>
意见/产品/index.js.erb
$('.sort_paginate_ajax').html("<%= escape_javascript(render("products"))%>")
资产/javascripts/application.js
$(function() {
$(".sort_paginate_ajax th a, .sort_paginate_ajax .pagination a").on("click", function(){
$.getScript(this.href);
return false;
});
});
所以首先我们在 Product 上为所有产品调用 paginate 方法,这里将根据选项设置偏移量,params[:page]
并通过per_page
选项设置限制。此外,我们正在渲染products
部分,每次打开其他页面时都会渲染。
在@products
您想要的部分调用中,然后will_paginate
在方法上应用方法
@products
,它还会创建params[:page]
在控制器中使用的方法。
现在响应 ajax 请求,使用我们创建的部分呈现div
具有类的内容。sort_paginate_ajax
还要发出请求 ajax 请求,在文档中加载所有a
标签的捕获脚本div.sort_paginate_ajax
,并返回 false。
现在将使用 ajax 请求调用页面
我希望这会对你有所帮助。
对先前答案的补充。
代码串:
$(".sort_paginate_ajax th a, .sort_paginate_ajax .pagination a").on("click", function(){
替换为字符串:
$(".sort_paginate_ajax").on("click", ".pagination a", function(){
onclick 事件仅适用于已存在的元素。因此,对于新出现的链接,需要将父级“.sort_paginate_ajax”的单击事件委托给子级“.pagination a”。
你可以只使用 JQuery:
控制器:
def index
@posts = Post.paginate(:page => params[:page])
respond_to do |format|
format.html
format.js
end
end
然后在 index.html.erb 中:
<div id="post-content", posts: @posts >
<%= j render 'post_content' %>
</div>
在部分“_post_content.html.erb”中:
<%= will_paginate @posts %>
<% @posts.each do |post| %>
<p><%= post.content %></p>
<% end %>
分页.js:
$(document).ready(function() {
$('.pagination > a').attr('data-remote', 'true');
});
index.js.erb:
$('#post-content').html("<%= j render 'post_content' %>")
确保添加
$('.pagination > a').attr('data-remote', 'true');
再次在您的 JS 模板 (index.js.erb) 中,因此它会在 Ajax 运行时再次设置链接数据远程。
我想扩展皮埃尔的答案。
如果您将 materialize sass 与 will_paginate_materialize 一起使用,那么您将有一个初始化器来设置分页链接的样式。
gem 'will_paginate', '~> 3.1.0'
gem 'will_paginate-materialize', git: 'https://github.com/mldoscar/will_paginate-materialize', branch: 'master'
因此,为了让远程 true 在 will_paginate_materialize 初始化程序呈现的链接上工作,我这样做了:
will_paginate_helper.rb
module WillPaginateHelper
class WillPaginateJSLinkRenderer < WillPaginate::ActionView::LinkRenderer
end
def js_will_paginate(collection, options = {})
will_paginate(collection, options.merge(:renderer =>WillPaginateHelper::WillPaginateJSLinkRenderer))
end
end
我将 will paginate materialize 初始化器更改为如下所示:
will_paginate_materialize.rb
MaterializePagination::MaterializeRenderer.module_eval do
def page_number(page)
classes = ['waves-effect', ('active' if page == current_page)].join(' ')
tag :li, link(page, page, :rel => rel_value(page)), class: classes
end
def prepare(collection, options, template)
options[:params] ||= {}
options[:params]['_'] = nil
super(collection, options, template)
end
protected
def link(text, target, attributes = {})
if target.is_a? Fixnum
attributes[:rel] = rel_value(target)
target = url(target)
end
@template.link_to(target, attributes.merge(remote: true)) do
text.to_s.html_safe
end
end
end
WillPaginate::ViewHelpers::LinkRenderer.class_eval do
def symbolized_update(target, other, blacklist = nil)
other.each_pair do |key, value|
key = key.to_sym
existing = target[key]
next if blacklist && blacklist.include?(key)
if value.respond_to?(:each_pair) and (existing.is_a?(Hash) or existing.nil?)
symbolized_update(existing || (target[key] = {}), value)
else
if value.instance_variable_defined?(:@parameters)
value = value.instance_variable_get(:@parameters)
end
target[key] = value
end
end
end
end
在我看来,我将渲染器留在了将分页链接中:
= will_paginate results, renderer: MaterializePagination::Rails
为了继续 @Pierre 的出色答案创建助手,我看到了一些关于更新视图的后续问题(我最初遇到的一个问题)。@Pierre 通过说明您需要创建一个 js 响应来跟进该问题。这是我在创建助手后所做的:
在我的 show.html.erb
<div id="see-comments">
<%= render @comments %>
</div>
<div id="pagination-comments">
<%= js_will_paginate @comments %>
</div>
我创建了另一个名为 show.js.erb 的文件(因此有两种显示格式)
// to update comments
$("#see-comments").html("<%= j render @comments %>");
// to update the pagination links
$("#pagination-comments").html('<%= js_will_paginate @comments %>');