一:前提
http://nubyonrails.com 提供的calendar_helper 并不支持ajax,而在我们平常应用,经常需要这样的功能:仅仅加载局部的日历。
二:动手
其实很简单,就是通过Ajax.Updater来更新日历即可。
第一步:修改calendar_helper 第100行起的代码,为:
cal = %(<table class="#{options[:table_class]}" border="0" cellspacing="0" cellpadding="0">)
cal << %(<thead><tr>)
cal << %(<th colspan="2"><a href='javascript:previous_month(#{options[:year]},#{options[:month]})'>#{options[:previous_month_text]}<a></th>)
colspan=3
cal << %(<th colspan="#{colspan}" class="#{options[:month_name_class]}">#{Date::MONTHNAMES[options[:month]]}</th>)
cal << %(<th colspan="2"><a href='javascript:next_month(#{options[:year]},#{options[:month]})'>#{options[:next_month_text]}</a></th>)
修改default_options 中这两个label
:previous_month_text =>'Previous',
:next_month_text => 'Next'
第二步:
新增route
map.calendar '/calendar/:year/:month', :controller=>'calendar'
第三步:
具体实现,仅仅为演示,你可以自己实现你的代码
在页面上增加日历
new Ajax.Updater('calendar', '/calendar/2008/03')
新增Action
def calendar
now =Time.now
@year = params[:year]||now.year
@month = params[:month]||now.month
…..
@dates = @someresults.collect(&:some_date_field)
render :partial=>'calendar'
End
新增页面_partial.html.erb
<%=
calendar(:year => @year, :month => @month) do |d|
if @dates.include?(d)
[d.mday, {:class => "specialDay", :onclick=>"go('/programs/#{d.to_s(:db)}')", :target=>'_blank'}]
else
[d.mday, {:class => "normalDay"}]
end
end
%>
效果
点击上一月,下一月,查看firebug的console,会看到发送不同的请求,日历部分的页面片段会同时改变。
Done。