返回页面后，flatPickr中的日历消失
返回页面后，flatPickr中的日历消失
提问于 2020-08-19 21:37:13
我正在开发一个Rails 5项目，并使用flatPickr gem来制作日历。日历运行良好，允许我在日期进行搜索，而不会出现问题。我以为一切都很好。然而，我注意到，当我离开我的主页，在那里我使用flatPickr并返回它时，日历不再出现。我已经检查了页面，甚至可以看到表单中不再有flatPickr CSS类。这个应用程序就像是忘记了flatPicker。下面是我的代码：
application.js：
//= require jquery
//= require rails-ujs
//= require activestorage
//= require turbolinks
//= require bootstrap
//= require_tree .
//= require flatpickr
document.addEventListener('DOMContentLoaded', function() {
flatpickr('#datePicker', {
enableTime: false,
dateFormat: "Y-m-d",});
})
document.addEventListener('DOMContentLoaded', function() {
flatpickr('#datePicker2');
})home.html.erb：
<%= form_with(url: "/report", method: "get", remote: true) do |f| %>
<%= f.label(:first_date, "First Date:") %>
<%= f.text_field(:first_date, id: 'datePicker') %>
<%= f.label(:last_date, "Last Date:") %>
<%= f.text_field(:last_date, id: 'datePicker2') %>
<br>
<p>Enter Report Type:</p>
<%= select_tag :reportType,
options_for_select([['po', 'po'], ['invoice', 'invoice'], ['sale', 'sale'], ['received', 'received']]) %>
<br>
<%= submit_tag("Show Report") %>
<% end %>我不确定，但我想知道我的问题是否与使用DOMContentLoaded有关。就像我说的，当我最初登陆/刷新主页时，效果很好。一旦我离开主页并回来，它就不能工作了。谢谢你的帮助。
更新:我尝试在rails中使用datePicker gem，得到了同样的问题。我还将我的jquery调用修改为：
$(document).ready(function(){
$("#datePicker").focus(function(){
flatpickr('#datePicker');
});
});
window.addEventListener("pageshow", function() {
flatpickr('#datePicker2');
})仍然会遇到同样的问题--当我离开某个页面时，日历就不再出现了。
回答 1
Stack Overflow用户
回答已采纳
发布于 2020-08-19 23:28:44
我能够回答我的问题，解决方案是：
window.addEventListener("turbolinks:load", function() {
flatpickr('#datePicker2');
})它添加了turbolinks:加载有帮助。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/63488240
复制相关文章
相似问题
腾讯云开发者
