JQuery datepicker实现日期组件下拉选择

2019独角兽企业重金招聘Python工程师标准>>>

参考文献：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，及样式表：

  
  
  <%= stylesheet_link_tag "application", "common_style", "easyui", :media => "all" %>    #在application.js中调用所有需要的js文件
  <%= javascript_include_tag "application" %>
  <%= csrf_meta_tags %>
  <%= yield :header %>
 

然后，调用即可，片段如下：

  项目预计结束时间
  <%= f.datepicker :time, :size => 10 %>


#使用datepicker默认格式
<% content_for(:header) do %>
    <%= stylesheet_link_tag "jquery-ui" %>
<%end%>

转载于:https://my.oschina.net/u/811744/blog/179235