Rails - 使用引導datetimepicker窗體，日期沒有到達控制器？

Question

我想讓引導日期時間選擇器與我的rails程序一起工作。下面是我使用的形式，它的使用simpleforms：

<%= simple_form_for(@event, html: {class: "form-horizontal"}) do |f| %> 
    <%= f.error_notification %> 

    <%= f.input :title %> 
     <script type="text/javascript"> 
    $(function() { 
    $('#datetimepicker1').datetimepicker({ 
     pickTime: false 
    }); 
    }); 
</script> 
    <%= f.input :date, as: :custom %> 
    <%= f.input :description, as: :text, input_html: {rows: "5"} %> 

    <div class="form-actions"> 
    <%= f.button :submit, class: "btn btn-primary" %> 
    </div> 
<% end %> 

這裏是：在simpleforms自定義

def input 
text_field_options = input_html_options.dup 
hidden_field_options = input_html_options.dup 

text_field_options[:id] = "datetimepicker1" 
text_field_options[:class] = 'input-append date form-horizontal' 
text_field_options['data-date-format'] = I18n.t('date.datepicker') 

hidden_field_options[:id] = "#{attribute_name}_hidden" 

return_string = 
    "#{@builder.text_field(attribute_name, text_field_options)}\n" + 
    "#{@builder.hidden_field(attribute_name, hidden_field_options)}\n" 
return_string = '<div id="datetimepicker1" class="input-append date form-horizontal"> 
<input data-format="MM/dd/yyyy" type="text"> 
<span class="add-on"> 
    <i data-time-icon="icon-time" data-date-icon="icon-calendar" class="icon-calendar"> 
    </i> 
</span> 

' 回報return_string.html_safe 結束

在我的活動控制器，我有這個命令來記錄事件的值。

Rails.logger.info ("debug:" + @event.to_yaml) 

當我跑的形式來創建一個事件，並檢查日誌，這是我所看到的：

debug:--- !ruby/object:Event 

屬性： ID： 標題：迅速莎莎我：斯塔基我莎莎 描述 位置： 日期： attendance_type： GROUP_SIZE： created_at： 的updated_at： USER_ID：1

標題+描述通過罰款，但日期：是空白的。任何建議你可能會非常感激，我對此很新，而且我正在爲此掙扎大約2天，我最近纔想到如何做日誌記錄，這讓我可以在這裏找到它。謝謝。

Answer 1

首先，這一部分：

return_string = '<div id="datetimepicker1" class="input-append date form-horizontal"> 
<input data-format="MM/dd/yyyy" type="text"> 
<span class="add-on"> 
    <i data-time-icon="icon-time" data-date-icon="icon-calendar" class="icon-calendar"> 
    </i> 
</span>' 

與相應的屬性文本輸入不呈現所以沒有被公佈：既然你重新定義變量下一

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

被跳過當你提交。另外，如果要將這兩個值組合並呈現它們，則會導致具有相同id的兩個元素（datepicker1）。

Answer 2

我只是回答鐵軌，simple_form和自舉日期選擇器類似的問題here

我已經包括了我的下文一個工作實施答案：

---

我還需要得到這個工作，並支持多不使用以美國爲中心的日期格式的語言環境，例如：日期格式爲dd/mm/yyy的en-AU（澳大利亞）。

的問題

Rails的預計日期格式是從瀏覽器yyyy-mm-dd，但要顯示在用戶的語言環境的日期。雖然日期控件允許您指定顯示格式，但它不允許您單獨指定要發送回服務器的格式。

解決方案

構建發送正確的格式返回給你的Rails服務器隱藏的輸入字段。我使用自定義的simple_form輸入控件執行此操作，該控件構建日期選擇器輸入字段和隱藏字段，並在輸入控件更改時使用一些javascript轉換爲導航日期。

的結果是，你可以在導軌一個很好的引導日期選擇器，並與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' 

配置/區域設置/ EN-AU.yml

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

配置/區域設置/ EN-US.yml

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

應用程序/資產/stylesheets/application.css.scss

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

應用程序/資產/ Javascript角/ application.js.coffee

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

或者，應用程序/資產/ Javascript角/ application.js中

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

應用程序/資產/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) 

應用程序/輸入/ 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