0

我正在尝试为我的 RoR 应用程序使用 bootstrap-datepicker，特别是这个。

我已经下载了 js 文件并将其放在 assets/javascripts 文件夹中

然后我制作了一个视图以使其以最简单的方式工作，这就是它所拥有的

<input type="text" value="02-16-2012" class="datepicker">

<script>
 $('.datepicker').datepicker({
     format: 'mm-dd-yyyy'
 });
</script>

它自然会显示带有“02-16-2012”的文本字段，但它不会让小日历在点击时弹出。有什么我想念的想法吗？

这是我的 application.js 文件的内容：

//= require jquery
//= require jquery_ujs
//= require twitter/bootstrap

我的 application.css 苍蝇有什么：

*= require_self
 *= require_tree .
 *= require bootstrap_and_overrides
 *= require bootstrap

控制台显示 2 个错误

Failed to load resource: the server responded with a status of 404 (Not Found)     http://127.0.0.1:3000/assets/default.css
Uncaught TypeError: Object [object Object] has no method 'datepicker'              test:113

的输出console.log($('.datepicker'))也是：

[input.datepicker, prevObject: jQuery.fn.jQuery.init[1], context: document, selector: ".datepicker", jquery: "1.9.1", constructor: function…]
4

4 回答 4

1

您的 jQuery 选择器缺少一个点 ( .)，您需要添加一个点来捕获所有具有datepicker类的元素：

<input type="text" value="02-16-2012" class="datepicker">

<script>
 $('.datepicker').datepicker({
     format: 'mm-dd-yyyy'
 });
</script>

datepicker您可能希望仅在具有类的输入上“保护”您的日期选择器部署：

$('input.datepicker').datepicker({ # match every input having 'datepicker' class
  format: 'mm-dd-yyyy'
});

也许尝试以下方法：

$(document).ready(function() {
    $('.datepicker').datepicker();
})
于 2013-05-22T16:42:46.773 回答
0

尝试添加日期选择器 css。

于 2013-05-22T16:33:07.547 回答
0

文档中所需的标记（具体来说，您需要添加 span.add-on 和 i.icon-th）：

<div class="input-append date datepicker" data-date="12-02-2012" 
  data-date-format="dd-mm-yyyy">
    <input class="span2" size="16" type="text" value="12-02-2012">
    <span class="add-on"><i class="icon-th"></i></span>
</div>
于 2013-05-22T16:36:53.063 回答
0

要将 CSS 和 Javascript 正确打包到 rails 资产管道中，我建议您使用这个 gem：https ://github.com/lubieniebieski/bootstrap-datetimepicker-rails

于 2013-10-24T07:33:01.340 回答