【问题标题】:Rails bootstrap Datepicker not workingRails bootstrap Datepicker不工作
【发布时间】:2015-03-13 04:40:19
【问题描述】:

我正在尝试将 datepicker 实现到 rails 应用程序,因此我可以通过这两个链接参考运行它:

http://jakoblaegdsmand.com/blog/2012/05/rails-datetime-picker/ https://github.com/Nerian/bootstrap-datepicker-rails

由于某种原因,当我使用脚手架运行它时它运行得很好,但是当我尝试通过构建模型、控制器、视图分别从头构建 Rails 应用程序来运行它时,它没有运行,当我单击时基本上没有任何反应在日期文本字段上。

这是我编写的以下代码。

在 Gemfile 中

gem 'bootstrap-datepicker-rails'

在 appplication.css 中

*= require bootstrap-datepicker

在application.js中

//= require bootstrap-datepicker

在_form.html.erb中

<%= form_for(@category) do |f| %>
<%= f.label :Name %><br/>
<%= f.text_field :name %><br/>
<%= f.label :Description %><br/>
<%= f.text_area :description %><br/>
<%= f.label :EmailID %><br/>
<%= f.text_field :emailid %><br/>
<%= f.label :Date %><br/>
<%= f.text_field :cdate, :class => 'datepicker', 'placeholder'=> "dd-mm-yyyy" %><br/>

<script>
  $(function() {
    $('.datepicker').datepicker({dateFormat: 'yy-mm-dd'});
});
  </script>
<% end %>

在 Schema.rb 中


ActiveRecord::Schema.define(version: 20150312163128) do

create_table "categories", force: :cascade do |t| t.string "name" t.string "emailid" t.text "description" t.date "cdate" t.datetime "created_at", null: false t.datetime "updated_at", null: false end

end

所以请告诉我我做错了什么,自 3 天以来一直被困在这个问题上。

【问题讨论】:

  • chrome 的开发者工具中是否有任何指示 JS 错误的内容?
  • 是的,它说“未捕获的引用错误:jquery 未定义”和“未捕获的 TypeError:未定义的不是函数”这一行“$('.datepicker').datepicker({dateFormat: 'yy-mm-dd'});" ,我已将代码上传到 git 你可以在这里找到它:github.com/nickkevin/testdate
  • 我试过了,它对我来说很好用。正如您指定的错误,明确表示未定义 jquery。这意味着 jquery 没有正确加载或在 datepicker 之后加载。请检查您包含的 JavaScript 序列。
  • Anuja 的答案是 100%。

标签: ruby-on-rails datepicker bootstrap-datepicker


【解决方案1】:

我检查了你的gihub link。而且你的顺序是错误的。 jquery 和 jquery-ui 应该始终排在第一位。

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

尝试如下更新:

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

【讨论】:

  • 是的,正如您所说,在调用文件时顺序错误。谢谢。我试图通过编写以下代码来动态实现开始日期和结束日期:-
  • 你到底想用那个方法做什么?
  • 好吧,我正在尝试动态设置开始和结束日期,所以随着时间的推移,它会采用当前日期值,因此所有以前的日期都被禁用,我将计数器设置为 30所以这 30 天内的任何日期都是可用的,所以这是最好的编写方式,还是我可以让代码更有效率。
猜你喜欢
  • 2014-10-16
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2015-01-25
  • 1970-01-01
相关资源
最近更新 更多