Question

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

基本上，我的时间选择器，时间字段不会发生这种情况。它只是作为text_field而没有弹出时间选择框供用户选择时间。 Datepicker工作得非常好，但我不确定为什么Timepicker不是以前从未使用过的。

我已经下载了这个库，并且在.js和.css文件中需要它，我做错了什么？

event.js.coffee

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 %>

Answer 1

你需要把：

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

在jQuery的文档就绪函数中，就像你第一次使用picker一样：

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

引用dom元素的任何$()方法都需要在此jQuery ->函数中，以便dom准备好并可供$()查找元素并对其进行操作。除非您将脚本加载到页面底部</body>上方。

此外，您无需检查：

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

因为打电话

$('#event_date').datepicker

如果找不到#event_date，

将无法执行任何操作。

Timepicker不在rails app上工作

1 个答案: