javascript - Timepicker 无法在 Rails 应用程序上运行

标签 javascript jquery ruby-on-rails ruby-on-rails-3 ruby-on-rails-4

所以,如果您使用过日期选择器,那么您就会知道它是如何工作的 - 当您单击与日期选择器关联的字段时,将弹出带有 jquery 的日历框并允许用户选择日期。

基本上,我的时间选择器、时间字段不会发生这种情况。它仅充当文本字段,并且不会弹出时间选择器框供用户选择时间。 Datepicker 工作得很好,但我不确定为什么 Timepicker 不行,因为我以前从未使用过它。

我已经下载了该库,并在 .js 和 .css 文件中需要它,我做错了什么?

event.js.咖啡

jQuery ->
  if $('#event_date').length > 0
    $('#event_date').datepicker <---datepicker which works 
      format: 'yyyy-mm-dd' 

$('#event_time').timepicker({ 'scrollDefaultNow': true }); <--- time picker which doesn't work   

form.html.rb

File Edit Options Tools Rinari nXhtml Buffers Services Help                                                                                                   
<%= simple_form_for @event do |f| %>                                                                                                                          
  <h5>Event title:</h5>                                                                                                                                       
  <div><%= f.input_field :title, placeholder: "Event title", required: true, autocomplete: :off %></div>                                                      
  <h5>Event description:</h5>                                                                                                                                 
  <div><%= f.input_field :description, placeholder: "Event description", required: true, autocomplete: :off %></div>                                          
  <h5>Event date:</h5>                                                                                                                                        
  <div><%= f.text_field :date  %></div> <---datepicker which works                                                                                                                       
  <div><%= f.text_field :time, id: "event_time" %></div> <--- time picker which doesn't work                                                                                                     
  <h5>Event location:</h5>                                                                                                                                    
  <div><%= f.input_field :location, placeholder: "Event location", required: true, autocomplete: :off %></div>                                                
  <div><%= f.submit @event.new_record? ? "Create event" : "Update event"  %></div><br />                                                                      
<% end %> 

最佳答案

您需要输入:

$('#event_time').timepicker({ 'scrollDefaultNow': true });

在 jQuery 的文档就绪函数中,就像使用第一次选择器一样:

jQuery ->
  $('#event_time').timepicker({ 'scrollDefaultNow': true });

任何 $()引用 dom 元素的方法需要在 jQuery -> 中函数,以便 dom 准备好并可用于 $()找到元素并对其采取行动。除非,您在页面底部加载脚本,就在 </body> 上方.

您也不需要检查:

if $('#event_date').length > 0

因为打电话

$('#event_date').datepicker

如果找不到#event_date,则不会执行任何操作.

关于javascript - Timepicker 无法在 Rails 应用程序上运行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20431043/

相关文章:

javascript - 如何解决 $.fullCalendar.formatDate 不是一个函数

javascript - 重新加载 Bootstrap 表刷新并更改设置

ruby-on-rails - 一次查询中的 Rails 客户端订单历史记录

javascript - 我正在尝试一个接一个地打印字母

javascript - 识别特定的 Div 而不是使用 .next()?

javascript - 复制对象数组

javascript - jQuery 幻灯片是跳动的

ruby-on-rails - 如何覆盖 ruby​​ 中的 [] 括号?

html - 什么是适用于 Ruby on Rails 的良好 PDF 到 HTML 转换器?

javascript - 排序数组多维javascript