web-dev-qa-db-ja.com

SimpleFormのより明確な日付ピッカー入力を作成する方法

が大好き simple_form gem for Railsしかし、次のコード行は好きではありません。

<%= f.input :deadline, :as => :string, :input_html => { :class => 'date_picker' } %>

私は書きたいと思います：

<%= f.input :deadline, :as => :date_picker %>

または:date/:datetime完全に一致。

しかし、私は本当に全体を書きたくありませんcustom_simple_form

可能だと思います...

助けてください

ruby-on-railsruby-on-rails-3forms
33
nodrog

新しいDatePickerInputクラスを定義する必要があります。

module SimpleForm
  module Inputs
    class DatePickerInput < Base
      def input
        @builder.text_field(attribute_name,input_html_options)
      end    
    end
  end
end

そして、あなたは今書くことができます

<%= f.input :deadline, :as => :date_picker %>

もちろん、あなたも必要です

 $("input.date_picker").datepicker();

application.js

これは日付をローカライズするのに非常に便利です。これを見てください：

module SimpleForm
  module Inputs
    class DatePickerInput < Base
      def input
        @builder.text_field(attribute_name, input_html_options.merge(datepicker_options(object.send(attribute_name))))
      end

      def datepicker_options(value = nil)
        datepicker_options = {:value => value.nil?? nil : I18n.localize(value)}
      end

    end
  end
end

これで、テキストフィールドにローカライズされた日付が表示されました。

更新：同じことを行うためのよりクリーンな方法

module SimpleForm
  module Inputs
    class DatePickerInput < SimpleForm::Inputs::StringInput
      def input_html_options
        value = object.send(attribute_name)
        options = {
          value: value.nil?? nil : I18n.localize(value),
          data: { behaviour: 'datepicker' }  # for example
        }
        # add all html option you need...
        super.merge options
      end
    end
  end
end

SimpleForm::Inputs::StringInputから継承し（@kikitoが言ったように）、いくつかのhtmlオプションを追加します。特定のクラスも必要な場合は、次のようなものを追加できます

def input_html_classes
  super.Push('date_picker')
end
37
vicvega

Simple_form 2.0を使用している場合、ここでの回答は少し古くなっているように見えます。

私はしばらくこれと戦っていて、これを巧みに作ることができました。継承を使用し（StringInputではなくBaseのサブクラスであることに注意）、i18nをサポートし、datepicker cssクラスをよりきれいな方法であるIMHOで追加します。

# app/inputs/date_picker_input.rb

class DatePickerInput < SimpleForm::Inputs::StringInput 
  def input                    
    value = input_html_options[:value]
    value ||= object.send(attribute_name) if object.respond_to? attribute_name
    input_html_options[:value] ||= I18n.localize(value) if value.present?
    input_html_classes << "datepicker"

    super # leave StringInput do the real rendering
  end
end

使い方は上記のようです：

<%= f.input :deadline, :as => :date_picker %>

また、JavaScriptは同じままです。

$("input.date_picker").datepicker();
42
kikito

@kikitoの回答に基づいて、ネイティブの日付ピッカーを取得するためにこれを行いました（つまり、特別なJSクラスはありません）。

config/initializers/simple_form_datepicker.rb

class SimpleForm::Inputs::DatepickerInput < SimpleForm::Inputs::StringInput 
  def input                    
    input_html_options[:type] = "date"
    super
  end
end

次に、それを次のように使用しました：

f.input :paid_on, as: :datepicker

simple_form_bootstrap3.rbイニシャライザなども持っている場合は、私たちのように、次のようにする必要があります。

  1. 入力のリストにDatepickerInputを追加します
  2. simple_form_bootstrap3.rb（または同様の）イニシャライザがaftersimple_form_datepicker.rbをロードして、DatepickerInputクラスが利用可能です。たとえば、 datepicker初期化子の名前をsimple_form_0_datepicker.rbに変更します。
6
Henrik N

他のオプションとして、デフォルトのDateTimeInputヘルパーを上書きすることもできます。これはapp/inputs/date_time_input.rbに配置する例です

class DateTimeInput < SimpleForm::Inputs::DateTimeInput
  def input
    add_autocomplete!
    @builder.text_field(attribute_name, input_html_options.merge(datetime_options(object.send(attribute_name))))
  end

  def label_target
    attribute_name
  end

  private

    def datetime_options(value = nil)
      return {} if value.nil?

      current_locale = I18n.locale
      I18n.locale = :en

      result = []
      result.Push(I18n.localize(value, { :format => "%a %d %b %Y" })) if input_type =~ /date/
      if input_type =~ /time/
        hours_format = options[:"24hours"] ? "%H:%M" : "%I:%M %p"
        result.Push(I18n.localize(value, { :format => hours_format }))
      end

      I18n.locale = current_locale

      { :value => result.join(', ').html_safe }
    end

    def has_required?
      options[:required]
    end

    def add_autocomplete!
      input_html_options[:autocomplete] ||= 'off'
    end
end

このメソッドを使用するとフォームのドロップ機能になりますが、simple_formの将来のバージョンでは機能しなくなる可能性があることに注意してください。

ローカライズされた日付に関する通知：私の知る限りRubyは、次の日付のみを解釈しますローカライズする前に注意して、Rubyがそれらを処理できることを確認してください。Ruby https://github.com/ZenCocoon/I18n-date-parser で開始されましたが、まだ機能していません。

0
Sébastien Grosjean - ZenCocoon