4

ブートストラップ日付ピッカーを使用して、simple_form_for を使用してフォームで日付を選択できるようにしています。例えば

  <%= f.input :payment_date, as: :string, input_html: { class: "datepicker" } %>

私の日付ピッカーは dd-mm-yyyy の形式を使用しています

simple_form_for を使用してフォームのデフォルト値として今日の日付を設定したいのですが、それを行う方法について何かアイデアはありますか?

4

4 に答える 4

11 
<%= f.input :payment_date, as: :string, input_html: { class: "datepicker", value: Time.now.strftime('%d-%m-%Y') } %>

別の形式は次のとおりです。（アクティブな管理者の宝石を使用）

f.input :date, as: :date_picker, :input_html => { :value => Date.today}
于 2013-05-04T12:35:00.303 に答える
6

また、これを機能させ、米国中心の日付形式を使用しない複数のロケールをサポートする必要もありました。たとえば、日付形式が dd/mm/yyyy の en-AU (オーストラリア) です。

問題

Rails はyyyy-mm-ddブラウザからの日付形式を想定していますが、ユーザーのロケールで日付を表示したいと考えています。日付コントロールでは表示形式を指定できますが、サーバーに送り返す形式を個別に指定することはできません。

ソリューション

Rails サーバーに正しいフォーマットを送信する非表示の入力フィールドを作成します。日付ピッカー入力フィールドと非表示フィールドの両方を構築するカスタム simple_form 入力コントロールを使用してこれを行い、入力コントロールが変更されたときに javascript を使用して Rails 日付に変換します。

結論は、レールに素敵なブートストラップ日付ピッカーを用意し、次のように simple_form で使用できることです。

<%= f.input :date, as: :bootstrap_datepicker %>

または、長い日付形式を使用するには:

<%= f.input :date, as: :bootstrap_datepicker, input_html: { format: :long } %>

実装

次のファイルを作成または編集します。

Gemfile

gem 'bootstrap-sass'
gem 'bootstrap-datepicker-rails'

config/locales/en-AU.yml

en-AU:
  date:
    datepicker:
      default: "dd/mm/yyyy"
      long: "dd MM, yyyy"
    formats:
      default: ! '%d/%m/%Y'
      long: ! '%d %B, %Y'

config/locales/en-US.yml

en-US:
  date:
    datepicker:
      default: "mm/dd/yyyy"
      long: "MM dd, yyyy"
    formats:
      default: "dd/mm/yyyy"
      long: ! '%B %d, %Y'

アプリ/アセット/スタイルシート/application.css.scss

@import "bootstrap-responsive";
@import "bootstrap-datepicker";

アプリ/資産/javascripts/application.js.coffee

#= require bootstrap
#= require bootstrap-datepicker
#= require bootstrap-datepicker-rails

または、app/assets/javascripts/application.js

//= require bootstrap
//= require bootstrap-datepicker
//= require bootstrap-datepicker-rails

app/assets/javascripts/bootstrap-datepicker-rails.js.coffee

$ ->
  # convert bootstrap-datepicker value to rails date format (yyyy-mm-dd) on our hidden field
  $(document).on 'changeDate', '.bootstrap-datepicker', (evt) ->
    rails_date = evt.date.getFullYear() + '-' + ('0' + (evt.date.getMonth() + 1)).slice(-2) + '-' + ('0' + evt.date.getDate()).slice(-2)
    $(this).next("input[type=hidden]").val(rails_date)

app/inputs/bootstrap_datepicker_input.rb

class BootstrapDatepickerInput < SimpleForm::Inputs::Base
  def input
    text_field_options = input_html_options.with_indifferent_access
    format =  text_field_options.delete(:format)
    hidden_field_options = text_field_options.dup
    hidden_field_options[:class] = text_field_options[:class].dup # so they won't work with same array object
    hidden_field_options[:id] = "#{attribute_name}_hidden"
    text_field_options[:class] << 'bootstrap-datepicker'
    text_field_options[:type] = 'text'
    text_field_options[:value] ||= format_date(value(object), format)
    set_data_option text_field_options, 'date-format', I18n.t(format, scope: [:date, :datepicker], default: :default)
    default_data_option text_field_options, 'provide', 'datepicker'

    return_string =
      "#{@builder.text_field(attribute_name, text_field_options.to_hash)}\n" +
      "#{@builder.hidden_field(attribute_name, hidden_field_options.to_hash)}\n"
    return return_string.html_safe
  end

protected

  def default_data_option(hash, key, value)
    set_data_option(hash,key,value) unless data_option(hash, key)
  end

  def data_option(hash, key)
    hash[:data].try(:[],key) || hash["data-#{key}"]
  end

  def set_data_option(hash, key, value)
    hash[:data].try(:[]=,key,value) || (hash["data-#{key}"] = value)
  end

  def value(object)
    object.send @attribute_name if object
  end

  def format_date(value, format=nil)
    value.try(:strftime, I18n.t(format, scope: [ :date, :formats ], default: :default))
  end
end
于 2013-09-26T02:31:11.230 に答える
1

Andrew Hacking が言ったことへのマイナーな追加: あなたの coffeescript もclearDateイベントをキャプチャする必要があります。

$ ->
  # convert bootstrap-datepicker value to rails date format (yyyy-mm-dd) on our hidden field
  $(document).on 'changeDate clearDate', '.bootstrap-datepicker', (evt) ->
    rails_date = if evt.date? then evt.date.getFullYear() + '-' + ('0' + (evt.date.getMonth() + 1)).slice(-2) + '-' + ('0' + evt.date.getDate()).slice(-2) else ''
    $(this).next("input[type=hidden]").val(rails_date)$(document).on 'changeDate clearDate', '.bootstrap-datepicker', (evt) ->`
于 2015-11-03T14:52:50.203 に答える