simple_form 中使用jquery datepicker
环境:
windows 7 professional
rails 3.2.2
ruby 1.9.3p125
simple_form(2.0.4)
bootstrap-sass 2.1.0
目标:
在simple_form中对date类型的filed可以使用以下tag
=t.input :date_field, :as=>:datepicker
具体操作:
1. 建立 /app/inputs/datepicker_input.rb
class DatepickerInput < SimpleForm::Inputs::Base def input @builder.text_field(attribute_name, input_html_options) + \ @builder.hidden_field(attribute_name, { :class => attribute_name.to_s + "-alt"}) end end
2.建立/app/assets/date.js.coffee
$ -> $("input.datepicker").each (i) -> $(this).datepicker altFormat: "yy-mm-dd" dateFormat: "yy-mm-dd" altField: $(this).next() $.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']);
3. 修改Gemfile文件
gem 'jquery-ui-rails'
4.修改/app/assets/javascripts/application.js
//= require jquery.ui.all
5.为了用上bootstrap的theme
git clone https://github.com/addyosmani/jquery-ui-bootstrap
将相关文件copy至/app/assets下的images, stylesheets文件夹下,
我使用的为jquery-ui-1.8.6.custom.css
6. 修改view后, 重新启动应用,一切OK
相关推荐
ParadiserD 2012-03-28
.ui-datepicker{width:17em;padding:.2em.2em0;display:none;font-size:大小}可惜我试了不起作用。我试着用js加载后改,发现成功了!!!!
wenmaomao 2014-01-02
suis 2016-03-16
小源丶同学 2015-09-07
PHP基础学习 2014-08-28
82483564 2014-04-21
谷歌架构师 2019-06-26
乔乔 2019-06-25
有心就有方向 2013-08-12
82550495 2013-08-12
asdjkl 2013-01-17
lihbobo 2019-06-21
hooopo 2009-04-07
Kindlecode 2012-10-24
JessieJWang 2012-10-17
菜鸟新手taob 2011-10-13
zyb00yaonuli 2011-10-12