Datepicker не работает с bootstrap-modal

Question

Я пытаюсь реализовать bootstrap modal по проекту rails. Он отлично работает, за исключением того, что мой дампикер не работает внутри модального. В моем файле индекса я следующее

<%= link_to "search_products", search_products_path, remote: true, "data-toggle" => "modal", 
    'data-target' => '#search-products' %> 

<div class="modal fade" id="search-products" tabindex="-1" 
    role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 
    <div class="modal-dialog"> 
     <div class="modal-content"></div> 
    </div> 
</div> 

Затем в приложение/просмотров/товаров/search_products.js.erb У меня есть

$("#search-products").html("<%= escape_javascript(render 'products/search_product') 
    %>") 

и внутри 'search_product' частичное

<%= text_field_tag :date_purchased, type: "text", placeholder: t('click_here'), 
    class: "form-control date_picker" %> 

Я использую rails4 Datepicker не из бутстрапа и отлично работает на немодальных страницах моего приложения. Я был бы признателен, если бы кто-нибудь мог сказать мне, что я делаю неправильно.

Благодаря

Answer 1

Попробуйте с помощью этого я использую это экстенсивно в моем проекте.

$('body').on('shown.bs.modal', '.modal', function() { 

     //Or perhaps any other initializer. 
     $('[databehaviour~=datepicker]').datepicker({ 
      minViewMode: "months", 
      format: "MM-yyyy", 
      startDate: "today" 
     }); 
} 

Answer 2

В вашей app/views/products/search_products.js.erb вы должны явно инициализировать DatePicker, как вы добавляете HTML динамически в DOM. Таким образом, файл должен выглядеть примерно так (в зависимости от того, что DatePicker вы используете):

$("#search-products").html("<%= escape_javascript(render 'products/search_product') %>"); 
$(".date_picker").datepicker();