Question

在我的Rails项目中，我目前有以下内容：

= f.label :created_at_gteq
= f.text_field :created_at_gteq, { :class => "ui-date-picker hasDatepicker" }
= f.label :created_at_lteq
= f.text_field :created_at_lteq, { :class => "ui-date-picker hasDatepicker" }

生成以下内容：

<label for="q_created_at_gteq">Created at greater than or equal to</label>
<input class="ui-date-picker hasDatepicker" id="q_created_at_gteq" name="q[created_at_gteq]" size="30" type="text">
<label for="q_created_at_lteq">Created at less than or equal to</label>
<input class="ui-date-picker hasDatepicker" id="q_created_at_lteq" name="q[created_at_lteq]" size="30" type="text">

在我的application.js中，我有以下内容：

//Makes calendar UI popup on date fields
$(function () {
  // Initializers and variables
  $.datepicker.setDefaults({ dateFormat: 'yy-mm-dd' });
  console.log($('input.ui-date-picker').datepicker());
});

加载页面时，在我的javascript控制台中返回以下内容：

[<input class="ui-date-picker hasDatepicker" id="q_created_at_gteq" name="q[created_at_gteq]" size="30" type="text">
, 
<input class="ui-date-picker hasDatepicker" id="q_created_at_lteq" name="q[created_at_lteq]" size="30" type="text">]

在body标记结束之前，插入以下HTML：

<div id="ui-datepicker-div" class="ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all"></div>

所以我知道它找到了正确的输入，甚至看起来它试图将数据贴图添加到DOM中，但是正在添加的div缺少div中的所有内容以及定位的内联样式它正确，所以当我点击日期字段时，日期选择器不会显示。

知道为什么它会错误地返回datepicker吗？

谢谢你的期待。

Answer 1

使用input元素看多个类的问题。

演示 - http://jsfiddle.net/ffwr2/4/

删除了第一个元素的hasDatepicker，它运行正常然而，第二个仍然不起作用。
删除两者都应该有效。

如何在我的Rails页面上正确加载jQuery datepicker？

1 个答案: