1

我正在尝试在我正在创建的表单上使用 Bootstrap Datepicker。我已经阅读了这里的文档：https ://github.com/Nerian/bootstrap-datepicker-rails/issues/11并遵循它（或者我认为），但我被卡住了。

Gemfile:
gem 'bootstrap-sass', '2.0.4'
gem 'bootstrap-datepicker-rails'

应用程序/资产/javascripts/application.js

//= require jquery
//= require jquery_ujs
//= require bootstrap
//= require bootstrap-datepicker
//= require_tree .

app/assets/javascripts/orders.js.coffee（我将 javascript 转换为 CoffeeScript）

$("[data-behaviour~='datepicker']").datepicker(
  format: "yyyy-mm-dd"
  weekStart: 1
  autoclose: true
).on "changeDate", (e) ->

应用程序/样式表/application.css.scss

 *= require_self
 *= require bootstrap-datepicker
 *= require_tree .
 */

表格（无论如何，相关部分）：

<%= form_for [@user, @order] do |order_form| %>

  <%= order_form.label "When would you like us to pick up your stuff?" %>
  <%= order_form.text_field :order_date, placeholder: "yyyy-mm-dd", 'data-behaviour' => 'datepicker' %> 

<% end %>

当我进入控制台时，我可以在一个元素上调用 datepicker() 方法并从那里操作它的属性。但是，无论出于何种原因，页面加载时它都不起作用。并且控制台中没有任何错误。

（根据我在这里读到的内容：Twitter bootstrap datepicker is not working in rails，我尝试了 require_self 的东西并将 javascript 也放入了 application.js 文件中。它没有用，我不喜欢拥有的想法无论如何，application.js 文件中的 javascript...)

4

1 回答 1

2

我未能将 Twitter Bootstrap Datepicker 与我的应用程序集成。相反，我使用了一个标准的jQuery datepicker并选择了一个与我的应用程序匹配的主题。我的代码最终看起来像这样：

在表格中：

<%= order_form.label "When would you like us to pick up your stuff?" %>
<%= order_form.text_field :order_date, id:"datepicker" %>

咖啡脚本：

$ ->
  $("#datepicker").datepicker({
    minDate: +1,
    dateFormat:"yy-mm-dd"
  })

我将此行添加到我的 custom.css 文件的顶部（@import bootstrap行之前）

@import url(http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/smoothness/jquery-ui.css);

在 application.css.scss 中（注意我删除了 require_bootstrap-datepicker）

 *= require_self
 *= require_tree .
 */

我从我的 gem 文件中删除了 gem。

我不知道 Twitter Bootstrap 日期选择器看起来会有多么不同，但这个主题非常适合我的应用程序。

于 2012-12-13T22:56:12.533 回答