[英]rails will_paginate display current page link only
Is there any way so that i can display only the current page link with << Previous link hidden when i am on first page and next >> link hidden when i am on last page. 有什么办法可以让我仅显示当前页面链接,其中当我位于首页时隐藏<<上一个链接,而当我位于最后一页时隐藏下一个>>链接。
It should be as follows 应该如下
on first page : 1 | 第一页: 1 | next >>
下一个>>
on last page(since having 4 pages) : << previous | 最后一页(因为有4页): <<上一页| 4
4
example of any center page : << previous | 任何中心页面的示例: <<上一页| 3 |
3 | next >>
下一个>>
currently what i am getting is : << previous | 目前我得到的是: <<上一页| 1 ... 4 |
1 ... 4 | next >>
下一个>>
My code 我的密码
<%= will_paginate @blogs, :class=>"pagination_links",:page_links => true, :next_label => "<span>| </span>Next >>",:previous_label => "<< Previous<span> |</span>",:inner_window => 0, :outer_window => 0 %>
Generated html is 生成的html是
<div class="pagination_links">
<span class="previous_page disabled">
<< Previous
<span> |</span>
</span>
<em class="current">1</em>
<span class="gap">…</span>
<a href="/blog?page=4">4</a>
<a class="next_page" href="/blog?page=2" rel="next">
<span>| </span>
Next >>
</a>
</div>
any solution for this? 有什么解决办法吗?
Using the default API options this is not currently possible, but will_paginate allows you to make custom link renderers. 目前无法使用默认的API选项,但是will_paginate允许您创建自定义链接渲染器。
To do this add the renderer key to your will_paginate function and tell it what renderer to use. 为此,将renderer键添加到will_paginate函数中,并告诉它要使用的渲染器。
<%= will_paginate @pages, renderer: PaginationLinkRenderer, previous_label:"« Previous |", next_label:"| Next »" %>
and create a file either in helpers/ or lib/ called pagination_link_renderer.rb
and add the following: 并在helpers /或lib /中创建一个名为
pagination_link_renderer.rb
并添加以下内容:
class PaginationLinkRenderer < WillPaginate::ActionView::LinkRenderer
protected
def page_number(page)
if page == current_page
page
end
end
def previous_or_next_page(page, text, classname)
if page
link(text, page, class: classname)
end
end
end
I achieved this using css 我使用CSS实现了
.current {
display: inline-block;
font-size: 12px;
text-decoration: none;
color: #000000;
}
.gap{
display : none !important;
}
.pagination_links a{
display:none;
}
.next_page,.previous_page{
display:inline-block !important;
color: #3343A0;
}
.pagination_links{
text-align: center;
}
.previous_page.disabled, .next_page.disabled{
display: none !important;
}
.pagination_links a{
text-decoration: none;
}
.pagination_links a:hover{
text-decoration: underline;
}
.pagination_links span{
text-decoration: none;
display: inline-block;
color: #000000;
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.