0

この https://github.com/jonthornton/jquery-timepickerを使用して

ここでのデモ: http://jonthornton.github.com/jquery-timepicker/

Rails 3.2アプリで

datepair の例を使用しようとすると、最初のフィールドのカレンダーがポップアップ表示されますが、時間フィールドが機能しない理由がわかりません。

ビューコード:

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

私が得るfirebugコンソールで：

$this.timepicker is not a function

$this.timepicker(opts);
4

1 に答える 1

1

あなたのRailsインストールはjquery.timepicker.jsをロードしていないと思います

datepair.js は jquery.timepicker.js と jQuery UI の datepicker を使用します (//= require jquery-uiそのためには application.js 内で使用します)。

これは私のRailsアプリにあるものです:

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

次に、.js ファイルの 1 つの中に:

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

そしてあなたの.cssファイルの1つの中に：

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

この jQuery プラグインをパッケージ化する gem を作成しました: https://github.com/tkrotoff/jquery-timepicker-rails

于 2012-04-14T16:11:41.743 に答える