react-bootstrap-datetimepicker icon indicating copy to clipboard operation
react-bootstrap-datetimepicker copied to clipboard

Datetimepicker localization

Open senkevichdv opened this issue 10 years ago • 5 comments

How can i localize this datetimepicker?

senkevichdv avatar Nov 10 '15 14:11 senkevichdv

The Moment library have a localization features.

oneassasin avatar Dec 08 '15 08:12 oneassasin

var moment = require('moment'); moment.locale(Your lang);

daochouwangu avatar Dec 10 '15 06:12 daochouwangu

I tried russian locale with moments.js, locale is changed as I can see in console.log, but Datetimepicker is not localized: weeks start from Sunday, months names are in english and time is 12 hours format (not 24 hours).

var React = require('react');
var ReactDOM = require('react-dom');
var DateTimeField = require('react-bootstrap-datetimepicker');

var moment = require('moment');
require('moment/locale/ru');
console.log(moment.locale()); 

var h1 = React.createElement('h1', {className: 'header', key: 'header'}, 'This is React');
var p = React.createElement('p', {className: 'content', key: 'content'}, "This is datapicker");
var dateTimeFieldEl = React.createElement(DateTimeField, {
  dateTime: "2015-01-01",
  format: "YYYY-MM-DD",
  viewMode: "date",
  inputFormat: "DD/MM/YYYY hh:mm",
  className: 'date1',
  key: 'date1'
});
var reactFragment = [h1, p, dateTimeFieldEl];
var section = React.createElement('section', {className: 'container'}, reactFragment);
ReactDOM.render(section, document.getElementById('react-application'));

klishevich avatar Mar 03 '16 19:03 klishevich

when I change to german with moment.locale('de') the months are correctly localized but the weekdays not

when I use

moment.locale('de', {
  weekdaysMin: 'So_Mo_Di_Mi_Do_Fr_Sa'.split('_')
})

not even the months are localized

barbalex avatar Apr 24 '16 15:04 barbalex

with the way @barbalex stated, I still cannot get it working.

turns out the weekdays displayed are hard coded in ./lib/DateTimePickerDays.js

SO I decided to change that into this.props.viewDate._locale._weekdaysMin[X] manually

then it worked

swearer23 avatar Aug 08 '16 06:08 swearer23