TrevorS / bootstrap3-datetimepicker-rails

This gem packages the bootstrap-datetimepicker for the Rails 3.1+ asset pipeline.
MIT License
292 stars 123 forks source link

Date format issues with Rails #18

Closed zoinks10 closed 10 years ago

zoinks10 commented 10 years ago

I have added the DateTimePicker to Rails, and I can get the dropdown date working fine - but the date formatting (YYYY/MM/DD) expected by Rails is not coming through from the text field - in fact, no matter where I choose to change the date format, the text_field ignores the change and continues with MM/DD/YY formatting. This means my dates either save incorrectly or not at all (argument out of range error thrown).

For what it's worth I am using the script: $(function () { $('#datetimepicker5').datetimepicker({ pickTime: false }); });

In my application.js file (if I try manipulating the format in this function it just ceases to work), and manipulating the date format using the data-date-format function as outlined in your documentation.

Is there a method to get the right date format sent through so that Rails can save it? I'm using Rails 4.1.1, Ruby 2.1.2, bootstrap3-datetimepicker-rails, '~> 3.1.2', momentjs-rails, '>= 2.8.1' and bootstrap-sass, '~>3.2.0'

Am I doing something wrong here?

TrevorS commented 10 years ago

Hello @zoinks10,

I created a Rails 4.1 application to test out the date format option and did not have any problems:

https://github.com/TrevorS/bs3dp-test

(app/views/index.html.erb):

<div class="col-sm-6">
  <h1>Bootstrap3 DTP Test</h1>
  <%= form_tag(test_index_path) do %>
    <div class="form-group">
      <%= label_tag :datetime, 'DateTime' %>
      <div class="input-group date" id="datetimepicker">
        <%= text_field_tag :datetime, nil, class: 'form-control', data: { date_format: 'YYYY/MM/DD' } %>
        <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span>
      </div>
    </div>
    <%= button_tag :submit, class: 'btn btn-primary' %>
  <% end %>
</div>

(app/assets/javascripts/test.js):

// Place all the behaviors and hooks related to the matching controller here.
// All this logic will automatically be available in application.js.
// You can use CoffeeScript in this file: http://coffeescript.org/
$(function() {
  $('#datetimepicker').datetimepicker({
    pickTime: false
  });
});

(Gemfile):

source 'https://rubygems.org'

gem 'rails', '4.1.1'
gem 'sqlite3'
gem 'sass-rails', '~> 4.0.3'
gem 'uglifier', '>= 1.3.0'
gem 'coffee-rails', '~> 4.0.0'
gem 'therubyracer',  platforms: :ruby
gem 'jquery-rails'
gem 'turbolinks'
gem 'jbuilder', '~> 2.0'
gem 'sdoc', '~> 0.4.0',          group: :doc
gem 'spring',        group: :development

gem 'bootstrap-sass', '~> 3.2.0'
gem 'momentjs-rails', '>= 2.8.1'
gem 'bootstrap3-datetimepicker-rails', '~> 3.1.2'

Selected date:

image

Submitted date:

image

zoinks10 commented 10 years ago

Thanks - it was the "data: { date_format: 'YYYY/MM/DD' }" that I needed rather than "data-date-format" which is in the documentation,

TrevorS commented 10 years ago

I believe data: { date_format: 'YYYY/MM/DD' } will be converted to data-date-format="YYYY/MM/DD" when the template is converted to HTML.

Happy to hear you were able to get everything to work!

jakehockey10 commented 10 years ago

When I bring up the edit form of my model with a date attribute, the content of the text_field is in the wrong format, so even if I change something else and I don't even touch the date field, I get an error. I tried putting this for the text_field: <%= f.text_field :date, class: 'form-control', placeholder: 'Date', data: { date_format: 'MM/DD/YYYY hh:mm A/PM'}%>

TrevorS commented 10 years ago

Hello @jakehockey10,

I think the problem you are having has to do with text_field expecting value as the second parameter.

I was able to get it to work like this:

 <%= f.text_field :date, nil, placeholder: 'Date', class: 'form-control' %>

The default (US) date format is MM/DD/YYYY hh:mm A/PM, so you probably don't need to specify it.