最近准备开发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 用户开发顺利 : )