Datepicker nie wyświetla kalendarza

Question

Mam w mojej aplikacji formularz, w którym mogę wybrać datę z kalendarza datepicker. Po odświeżeniu strony pojawia się kalendarz datepicker po kliknięciu w formularz. To jest prawidłowe zachowanie.

Jednak po dotarciu do tej samej strony z innej strony za pomocą linku, kalendarz nie pojawi się po kliknięciu w formularz. Muszę odświeżyć stronę, aby kalendarz był widoczny.

Oto moja strona forma:

# app/views/reservations/_form.html.erb 
... 

     <div class="row reservations"> 
     <div class="span2 field"> 
      <%= f.label :mydate %><br /> 
      <%= f.text_field :mydate, class: "input-append date datepicker", value: Date.today.strftime('%d-%m-%Y') %> 
     </div> 
... 

Mój kod javascript:

# app/assets/javascripts/reservations.js.coffee 
$ -> $('.date').datepicker({ 
    format: 'dd-mm-yyyy' 
    autoclose: true 
    todayHighlight: true 
    language: 'fr' 
}); 

A Gemfile:

source 'https://rubygems.org' 

ruby "2.0.0" 

# Bundle edge Rails instead: gem 'rails', github: 'rails/rails' 
gem 'rails', '4.0.0.beta1' 
gem 'bootstrap-sass', '2.3.1.0' 
gem 'bcrypt-ruby', '3.0.1' 
gem 'protected_attributes' 
gem 'will_paginate' 
gem 'bootstrap-will_paginate' 
gem 'bootstrap-datepicker-rails' 
gem 'rails-i18n' 

gem 'pg' 

# Gems used only for assets and not required 
# in production environments by default. 
group :assets do 
    gem 'sass-rails', '~> 4.0.0.beta1' 
    gem 'coffee-rails', '~> 4.0.0.beta1' 

    # See https://github.com/sstephenson/execjs#readme for more supported runtimes 
    # gem 'therubyracer', platforms: :ruby 

    gem 'uglifier', '>= 1.0.3' 
end 

gem 'jquery-rails' 

# Turbolinks makes following links in your web application faster. Read more: https://github.com/rails/turbolinks 
gem 'turbolinks' 

# Build JSON APIs with ease. Read more: https://github.com/rails/jbuilder 
gem 'jbuilder', '~> 1.0.1' 

Answer 1

byłem przeżywa ten sam problem. To jest problem z turbolinkami.

Możesz wyłączyć turbolinki na stronie źródłowej, z której pochodzisz, dodając dane-bez-dymka do href lub div, a to sprawi, że będzie działał. tj

<%= link_to "Create New Form", sampleform_path, 'data-no-turbolink' => true %> 

zobaczyć szczegóły here, w sekcji "Rezygnacja z Turbolinks".

[EDIT] Myślę, że lepszym rozwiązaniem jest wywołanie twojego dokumentu. Już kod na stronie: zmień wydarzenie również w coffeescript. Oto kod, którego można użyć:

$(document).on 'ready page:load', -> $('.date').datepicker({ 
    format: 'dd-mm-yyyy' 
    autoclose: true 
    todayHighlight: true 
    language: 'fr' 
}); 

Answer 2

Miałem ten sam problem z szynami 5 i autouzupełniania Jquery. Miałem swoje pole wyszukiwania w moim pasku nawigacyjnym i za każdym razem, gdy wchodziłem na inną stronę w mojej aplikacji, autouzupełnianie z elastycznym przeszukiwaniem zepsułoby się, a to nie wywoła wszystkich użytkowników powiązanych z tym, co pisałem. Aby naprawić, dodałem to do mojego _nav.html.erb <nav class="navbar navbar-fixed-top navbar-inverse" data-turbolinks="false">. Próbowałem go w moim dziale tuż obok pola wyszukiwania, ale to nie działało, ale działało w nawigatorze. Na stronie Turbolinks: Z Turbolinks, wydarzenia te będą uruchamiane tylko w odpowiedzi na początkowej stronie obciążenia nie po wszelkich późniejszych zmianach na stronie”

Answer 3

https://github.com/turbolinks/turbolinks/issues/253

Data kompletacji widget jQuery UI dołącza a. współdzielony element do ciała, którego oczekuje, nigdy nie opuści strony, ale Turbolinks usuwa ten element współdzielony w momencie ponownego generowania. Spełniamy to oczekiwanie, usuwając wspólny element ze strony, zanim Turbolinks buforuje stronę i dołączając ją ponownie, zanim Turbolinks zamieni miejscami nowe ciało podczas renderowania

Ponadto powrót do buforowanej wersji strony, która poprzednio zawierała elementy wyboru daty, spowodowałaby, że osoby wybierające daty nie były ponownie inicjowane. Naprawimy ten problem, znajdując wszystkie zainicjalizowane dane wejściowe selektora daty na stronie i wywołując metodę niszczenia selektora dat, zanim Turbolinks buforuje stronę.

document.addEventListener "turbolinks:before-cache", -> 
    $.datepicker.dpDiv.remove() 

    for element in document.querySelectorAll("input.hasDatepicker") 
    $(element).datepicker("destroy") 

document.addEventListener "turbolinks:before-render", (event) -> 
    $.datepicker.dpDiv.appendTo(event.data.newBody) 

Answer 4

Najprostszym rozwiązaniem jest użyć method: :get w link_to

<%= link_to "Create New Form", sampleform_path, method: :get %>