JQuery datepicker实现日期组件下拉选择
参考文献：datepicker官方文档实例
博客---rails3中使用datepicker
JQuery各种日期组件小介绍
在rails中实现日期下拉选择，重定义中文显示：在application.js中增加:
jQuery(function(){
$.datepicker.regional['zh-CN'] = {
clearText: '清除',
clearStatus: '清除已选日期',
closeText: '关闭',
closeStatus: '不改变当前选择',
prevText: '<上月',
prevStatus: '显示上月',
prevBigText: '<<',
prevBigStatus: '显示上一年',
nextText: '下月>',
nextStatus: '显示下月',
nextBigText: '>>',
nextBigStatus: '显示下一年',
currentText: '今天',
currentStatus: '显示本月',
monthNames: ['一月','二月','三月','四月','五月','六月', '七月','八月','九月','十月','十一月','十二月'],
monthNamesShort: ['一','二','三','四','五','六', '七','八','九','十','十一','十二'],
monthStatus: '选择月份',
yearStatus: '选择年份',
weekHeader: '周',
weekStatus: '年内周次',
dayNames: ['星期日','星期一','星期二','星期三','星期四','星期五','星期六'],
dayNamesShort: ['周日','周一','周二','周三','周四','周五','周六'],
dayNamesMin: ['日','一','二','三','四','五','六'],
dayStatus: '设置 DD 为一周起始',
dateStatus: '选择 m月 d日, DD',
dateFormat: 'yy-mm-dd', //设置显示格式
firstDay: 1,
initStatus: '请选择日期',
isRTL: false
};
$.datepicker.setDefaults($.datepicker.regional['zh-CN']);
$('#article_relese_date').datepicker({ //#article_relese_date datepicker的id, 对此id命名的datepicker,作如下设置
changeMonth:true, //显示月份下拉菜单
changeYear:true //显示年份下拉菜单
});
});
设置javascript，及样式表：
<head> <title>This is a test!</title> <link rel="icon" href="/assets/favicon.png"/> <%= stylesheet_link_tag "application", "common_style", "easyui", :media => "all" %> #在application.js中调用所有需要的js文件 <%= javascript_include_tag "application" %> <%= csrf_meta_tags %> <%= yield :header %> </head>然后，调用即可，片段如下：
<tr class="...">
<td>项目预计结束时间</td>
<td class="..."><%= f.datepicker :time, :size => 10 %></td>
</tr>
#使用datepicker默认格式
<% content_for(:header) do %>
<%= stylesheet_link_tag "jquery-ui" %>
<%end%>