Bootstrap-Datepicker не отображается с помощью Bootstrap-SASS
Я пытаюсь использовать 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 не работает в rails, я попробовал функцию require_self и поместил javascript в файл application.js. Это не сработало, и мне не понравилась идея иметь в любом случае javascript в файле application.js...)
1 ответ
Мне не удалось интегрировать Twitter Bootstrap Datepicker с моим приложением. Вместо этого я использовал стандартный инструмент выбора даты jQuery и выбирал тему, соответствующую моему приложению. Мой код в итоге выглядел так:
В виде:
<%= 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 .
*/
И я удалил драгоценный камень из своего файла драгоценного камня.
Я не знаю, как иначе выглядел бы плагин Twitter Bootstrap, но эта тема отлично работала для моего приложения.