jquery 日期/时间选择器问题（时间选择器不是函数）

Question

using this https://github.com/jonthornton/jquery-timepicker

demo here: http://jonthornton.github.com/jquery-timepicker/

on a rails 3.2 app

trying to use the datepair example and cant seem to figure out why the time fields don't work the calendar for the first field pops up, but nothing else.

view code:

  %p.datepair{'data-language' => "javascript"}
    = f.text_field :starttime, :class => 'date start'  
    %span.ui-timepicker-container
      = f.text_field :starttime, :class => 'time start ui-timepicker-input', :autocomplete => "off", :value => "12:15am"  
      %ul.ui-timepicker-list{ :tabindex => "-1", :style => "position: absolute; left: 567.667px; z-index: 2; top: 2246.87px; display: none;" }
        %li 12:00am
        %li 12:15am
        ...
        %li 12:30am
        %li 1:00am
    %span.ui.timepicker-container
      = f.text_field :starttime, :class => 'time start ui-timepicker-input', :autocomplete => "off"  
      %ul.ui-timepicker-list.ui-timepicker-with-duration{ :tabindex => "-1", :style => "position: absolute; left: 674.5px; z-index: 2; top: 2422.87px; display: none;"}
      = f.text_field :starttime, :class => 'date start hasDatePicker'  

in the firebug console I get:

$this.timepicker is not a function

$this.timepicker(opts);

Answer 1

I guess your Rails installation did not load jquery.timepicker.js

datepair.js uses jquery.timepicker.js and the datepicker from jQuery UI (use //= require jquery-ui inside your application.js for that).

This is what I have in my Rails app:

vendor/assets/javascripts/jquery-timepicker/datepair.js
vendor/assets/javascripts/jquery-timepicker/jquery.timepicker.js
vendor/assets/stylesheets/jquery-timepicker/jquery.timepicker.css

then inside one of your.js file:

//= require jquery-ui-addresspicker/jquery.ui.addresspicker.js
//= require jquery-timepicker/jquery.timepicker.js
//= require jquery-timepicker/datepair.js

and inside one of your.css file:

 *= require jquery-timepicker/jquery.timepicker.css

I have created a gem that packages this jQuery plugin: https://github.com/tkrotoff/jquery-timepicker-rails