1

When using ember-cli-bootstrap-datepicker the date I select on the calendar is not the date that displays on the input field when the calendar closes. It's the date selected -1 day.

However, I have another field that is bound to the same property {{expires_at}} and it displays the appropriate date I selected. I'm assuming this is a UTC conversion; even though it appears to happen no matter what time of day I try it. I am trying to figure out a way to have the ember-cli-bootstrap-datepicker input reflect the date I select.

The date being saved to the database is the correct date, however this is confusing my users seeing the incorrect date on the field.

The Bootstrap datepicker is bound to exprires_at field, which is backed by a rails backend with a date field - so the format it sends via JSON is YYYY-MM-DD as a string.

templates/admin/specials/form.hbs

<div class="form-group">
  <div class="input-group">
    <label for="expires_at" class="input-group-addon fa fw fa-calendar"> Expire Date</label>
    {{bootstrap-datepicker value=expires_at todayBtn=true autoclose=true class="form-control"}}
  </div>
</div> <!-- /.form-group -->

On the same template, I have a preview of what the output will generate, its a coupon so I have the fields displaying the actual coupon with all the data entered from the fields on the form so the end users knows what it's going to look like.

<!-- language-all: lang-html -->

<p<Expires {{short-date expires_at}}. For questions please call ...</p>

I have also tried this with out the short-date helper, and it still returns the correct date selected.

helpers/short-date.js

import Ember from "ember";

export default Ember.Handlebars.makeBoundHelper(function(value) {
  // return moment(value, "MM-DD-YYYY");
  return moment(value, "YYYY-MM-DD").format("MM/DD/YYYY");
});

package.json



      "devDependencies": {
        "broccoli-asset-rev": "^2.0.0",
        "broccoli-ember-hbs-template-compiler": "^1.6.1",
        "ember-cli": "0.1.15",
        "ember-cli-6to5": "^3.0.0",
        "ember-cli-app-version": "0.3.1",
        "ember-cli-bootstrap-datepicker": "0.3.1",
        "ember-cli-bootstrap-sassy": "0.0.12",
        "ember-cli-content-security-policy": "^0.3.0",
        "ember-cli-dependency-checker": "0.0.7",
        "ember-cli-font-awesome": "0.0.9",
        "ember-cli-form-data": "0.0.8",
        "ember-cli-ic-ajax": "0.1.1",
        "ember-cli-inject-live-reload": "^1.3.0",
        "ember-cli-moment": "0.0.1",
        "ember-cli-qunit": "0.3.7",
        "ember-cli-sass": "^3.1.0-beta",
        "ember-cli-simple-auth": "0.7.3",
        "ember-cli-simple-auth-devise": "0.7.3",
        "ember-cli-uglify": "1.0.1",
        "ember-data": "1.0.0-beta.14.1",
        "ember-export-application-global": "^1.0.2",
        "ember-localstorage-adapter": "^0.5.2",
        "express": "^4.8.5",
        "glob": "^4.0.5"
      }

bower.json



      "dependencies": {
        "handlebars": "~1.3.0",
        "jquery": "^1.11.1",
        "ember": "1.8.1",
        "ember-data": "1.0.0-beta.14.1",
        "ember-resolver": "~0.1.11",
        "loader.js": "ember-cli/loader.js#1.0.1",
        "ember-cli-shims": "ember-cli/ember-cli-shims#0.0.3",
        "ember-cli-test-loader": "ember-cli/ember-cli-test-loader#0.1.1",
        "ember-load-initializers": "ember-cli/ember-load-initializers#0.0.2",
        "ember-qunit": "0.2.8",
        "ember-qunit-notifications": "0.0.7",
        "qunit": "~1.17.1",
        "bootstrap-sass-official": "~3.3.3",
        "ember-simple-auth": "0.7.3",
        "bootstrap-datepicker": "~1.3.1"
      }

I could probably hide the actual input field for the bootstrap picker and just show another {{exipres_at}} field, but I feel like there's away to get the datepicker to show local time and I'm just missing it. I have almost no configuration for it, and not sure where I should be passing in any options besides inline but I do not see the option for local time.

1 Answers1

0

I'm author of the ember-cli-bootstrap-datepicker add-on. I'm sorry for inconvenience, but there was a bug with UTC conversion. The bug has been fixed and a new version of the add-on is ready to be released.

I would appreciate if you could check the datepicker on the demo page and tell me when the problem has gone or not. I've already did that using different timezones and everything seems fine for me.

Have a great day! :)

UPDATE: v0.3.3 has been released recently and it fixes the issue. Please install the update and enjoy your work.

  • Sorry for the delay, I have been out of town on on family matters and just returning and getting around to work on this project again. The demo page always seemed correct to me, but I i will check it out again and test thoroughly. I'm new to ember, ember-cli. What is the proper way to upgrade/update add-ons? Reinstall, or change package.json? – Mark Meibers Apr 06 '15 at 23:03
  • Just run `ember install:addon ember-cli-bootstrap-datepicker`. That should work fine :) – Alexander Sulim Apr 08 '15 at 08:14