在表单中将bootstrap-datepicker-rails添加到date_select [英] Adding bootstrap-datepicker-rails to date_select in form

问题描述

所以，我有一个使用'date-select'的表单，它为每个使用的date-select（年，月和日）呈现三个选择框。

So, I have a form that uses 'date-select', which renders three select boxes per used date-select (year, month and day).

相反，我想使用datepicker，并按照这里的说明进行操作。但是，我不知道如何在视图中以实际形式实现datepicker。

Instead I want to use datepicker, and I've followed the instructions here. However, I don't have a clue how to actually implement the datepicker in the form in the view.

我在application.js中使用以下行。 。

I'm using the following line in application.js...

$('.datepicker').datepicker()

...所以我想我需要给选择框class.datepicker？

...so I guess I need to give the select boxes the class .datepicker?

<%= form_for @project do |f| %>
    <div class="text_field">
        <%= f.label :title%>
        <%= f.text_field :title%>
    </div>
    <div class="text_field">
        <%= f.label :description%>
        <%= f.text_field :description%>
    </div>
    <div class="dropdown">
        <%= f.label :start_date%>
        <%= date_select :start_date, :startdate %>
    </div>
    <div class="dropdown">
        <%= f.label :end_date%>
        <%= date_select :end_date, :enddate%>
    </div>
    <div class="select">
        <%= f.label :title%>
    </div>
    <div class="submit">
        <%= f.submit "Spara" %>
    </div>
<% end %>

推荐答案

尝试：

<%= date_select :start_date, :startdate , :class => 'datepicker' %>

编辑：我在我的机器上复制了你的代码，发现可能的错误：

I have replicated your code on my machine and found the possible mistakes:

此宝石在文本字段中选择日期，而不是在 date-select 中。输入应该是 text_field ，它看起来像这样：

This gem selects the date in a text field, not in a date-select . The input should be text_field and it looks like this:

<%= f.text_field :date, :class => 'datepicker' %>

如gem的安装指南中所述，您应该确保 require 它们都在你的 application.css 和 application.js 中。另一件重要的事情是：在你的 projects.js.coffee 中，确保已加载DOM，如下所示：

As described in the gem's install guide , you should be sure to require it both in your application.css and application.js . One more important thing : in your projects.js.coffee make sure that the DOM is loaded , like this :

jQuery ->
  $('.datepicker').datepicker()

这篇关于在表单中将bootstrap-datepicker-rails添加到date_select的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！