最近准备开发web项目,挑来选去,最终决定用Rails开发。离别Rails许久,发现现在的版本已经是2.0了,看来Rails还是一如继往的健康成长,而且国内的许多Rails社区也充满了活力,很是开心。
Rails 2.0中发生了一些变化,最先遇见的就是分页。Rails 2.0之前的版本提供了Paginate方法,大体的写法如下:
Controller:
@album_pages, @albums = paginate(:albums,
:order => 'year DESC',
:conditions => condition,
:per_page => 3)
View:
<% if @tag %>
<%= pagination_links(@album_pages, :params => {:tag=>@tag }) %>
<% else %>
<%= pagination_links(@album_pages) %>
<% end %>
不知道为什么,这种简单舒适的写法在Rails2.0中消失了。
按照以上写法,Rails2.0会提示无法识别:pagination 方法(undefined method `paginate' for …):
现在更推荐另外一个替代插件will_paginate,下面详细说明下will_paginate的安装,使用步骤:
安装will_paginate:
1. 安装 subversion:
本机必须安装subversion客户端才能完全下载will_paginate的插件包,这里提供一个下载地址:
http://subversion.tigris.org/files/documents/15/34093/svn-1.4.0-setup.exe
subversion应该被视为rails开发者的标准配置,做个广告,嘿嘿。
2. 安装 will_paginate插件包:
进入ruby的控制台,之后进入你的rails项目:键入如下命令:
ruby script/plugin install svn:
如果一切正常的话,will_paginate已经安装到你的web应用中了。
你可以在应用程序中找到已安装的文件:
你也可以下载will_paginate的压缩包,当然不是官方发布的,这里提供一个下载地址:
http://www.javaeye.com/topic/154713
直接拷贝到 vendor\plugins\下即可。
代码部分:
Controller:
if params[:tag] != nil
@posts = Post.search_by_tag(params[:tag], params[:page]||1)
else
@posts = Post.search(params[:page]||1)
End
Model:
def self.search_by_tag(search, page)
paginate :per_page => 10, :page => page,
:conditions => ['tag like ?', "%#{search}%"],
:order => 'add_time'
end
def self.search(page)
paginate :per_page => 10, :page => page,
:order => 'add_time'
End
View:
<%= will_paginate @posts %>
测试一下,如果一切正常,分页列表已经展现在你的眼前了~~~
修改源码:
为了让更多的中国用户方便使用我的网站,最终还是决定把Previous和Next换成前一页和下一页,找到will_paginate中的view_helpers.rb文件,找到如下代码:
@@pagination_options = {
:class => 'pagination',
:prev_label => '« Previous',
:next_label => 'Next »',
:inner_window => 4, # links around the current page
:outer_window => 1, # links around beginning and end
:separator => ' ', # single space is friendly to spiders and non-graphic browsers
:param_name => :page,
:params => nil,
:renderer => 'WillPaginate::LinkRenderer',
:page_links => true,
:container => true
}
不用我多说了,will_paginate的基本配置信息都在这里了,help yourself吧,哈哈。
给分页栏添加样式:
说到这里,我想顺便提及一下monorail的分页样式,这是monorail 中自带的分页控件:DiggStylePagination所生成的前端代码:
Code
<div style="padding-right: 3px; padding-left: 3px; padding-bottom: 3px; margin: 3px; padding-top: 3px; text-align: right">
<span style="border-right: #eee 1px solid; padding-right: 5px; border-top: #eee 1px solid; padding-left: 5px; padding-bottom: 2px; margin: 2px; border-left: #eee 1px solid; color: #ddd; padding-top: 2px; border-bottom: #eee 1px solid">?
prev</span>
<span class="font-weight: bold; background-color: #000099; color: #fff; padding: 2px 5px 2px 5px; margin: 2px; border: 1px solid #000099;">1</span>
<a style="border-right: #aaafee 1px solid; padding-right: 5px; border-top: #aaafee 1px solid; padding-left: 5px; padding-bottom: 2px; margin: 2px; border-left: #aaafee 1px solid; color: #000099; padding-top: 2px; border-bottom: #aaafee 1px solid; text-decoration: none"
href="/album/list.html?page=2">2</a>
…
<a style="border-right: #aaafee 1px solid; padding-right: 5px; border-top: #aaafee 1px solid; padding-left: 5px; padding-bottom: 2px; margin: 2px; border-left: #aaafee 1px solid; color: #000099; padding-top: 2px; border-bottom: #aaafee 1px solid; text-decoration: none"
href="/album/list.html?page=33">33</a>
<a style="border-right: #aaafee 1px solid; padding-right: 5px; border-top: #aaafee 1px solid; padding-left: 5px; padding-bottom: 2px; margin: 2px; border-left: #aaafee 1px solid; color: #000099; padding-top: 2px; border-bottom: #aaafee 1px solid; text-decoration: none"
href="/album/list.html?page=34">34</a>
<a style="border-right: #aaafee 1px solid; padding-right: 5px; border-top: #aaafee 1px solid; padding-left: 5px; padding-bottom: 2px; margin: 2px; border-left: #aaafee 1px solid; color: #000099; padding-top: 2px; border-bottom: #aaafee 1px solid; text-decoration: none"
href="/album/list.html?page=2">next ?</a>
</div>
在这里想把这种做法作为一种反例,把css标记与html代码结合在一起的坏处,在这里就不赘述,will_paginate生成的html代码是这样的:
Code
<DIV class=pagination>
<SPAN class=disabled>? 前一页</SPAN>
<SPAN class=current>1</SPAN> <A href="/bet/list?page=2">2</A>
<A href="/bet/list?page=2">下一页 ?</A>
</DIV>
孰优孰劣,不言自明,will_pagnate给样式留下了友好的扩展接口,在每个需要控制样式的标签上留下了类选择器,使手动添加样式,成为了简单顺手的事。定义如下样式表:
Code
div.pagination {}{
padding: 3px;
margin: 3px;
}
div.pagination a {}{
padding: 2px 5px 2px 5px;
margin: 2px;
border: 1px solid #AAAADD;
text-decoration: none; /**//* no underline */
color: #000099;
}
div.pagination a:hover, div.pagination a:active {}{
border: 1px solid #000099;
color: #000;
}
div.pagination span.current {}{
padding: 2px 5px 2px 5px;
margin: 2px;
border: 1px solid #000099;
font-weight: bold;
background-color: #000099;
color: #FFF;
}
div.pagination span.disabled {}{
padding: 2px 5px 2px 5px;
margin: 2px;
border: 1px solid #EEE;
color: #DDD;
}
</style>
看看效果:
参考链接:
http://www.javaeye.com/topic/154713
http://hideto.javaeye.com/blog/108118
http://errtheblog.com/posts/56-im-paginating-again
http://www.javaeye.com/topic/147789
写到这里,祝Rails 用户开发顺利 : )