Jquery-ui datepicker with ransack

Question

我正在尝试使用 ransack 设置日期范围过滤器。所以在我看来：

 <%= f.text_field :DATE_gteq, :id => "datepicker" %>
 <%= f.text_field :DATE_lteq, :id => "datepicker" %>

我正在使用 jquery-ui datepicker。

设置：

宝石文件：

gem 'jquery-ui-rails' 

应用程序.js

//= require turbolinks
//= require jquery
//= require jquery_ujs
//= require jquery-ui/datepicker

$("#datepicker").datepicker();

应用程序.scss

@import 'jquery-ui/datepicker';

application.html.erb

 <script>
      $(function() {
          $( "#datepicker" ).datepicker();
      });
  </script>
  </body>

问题是，当我点击第一个搜索字段时，它确实显示日历，当我点击第二个搜索字段时，没有任何反应。

可能是什么原因？

Answer 1

注意：同一页面上不能有多个重复的 id

在视图中使用一个类并调用如下：

$('.datepicker').each(function(){
    $(this).datepicker();
});