JQuery-ui datepicker с ransack

Question

Я пытаюсь установить фильтр диапазона дат с ransack. Итак, на мой взгляд:

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

И я использую jquery-ui datepicker.

Чтобы установить его:

Gemfile:

gem 'jquery-ui-rails' 

application.js

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

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

application.scss

@import 'jquery-ui/datepicker'; 

application.html.erb

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

Проблема заключается в том, что при щелчке по первому полю поиска он показывает календарь, когда я нажимаю на второй, ничего не происходит.

В чем может быть причина?

Answer 1

Примечание: Вы не можете иметь несколько повторяющихся идентификаторов на одной странице

Используйте класс в представлении и называют, как показано ниже:

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