1.1.2 • Published 9 years ago

react-datetimepicker-bootstrap v1.1.2

Weekly downloads
143
License
MIT
Repository
github
Last release
9 years ago

React DateTimePicker Bootstrap npm version Build Status

Docs & Help

Installation

Using npm:

$ npm install --save react-datetimepicker-bootstrap

Usage

// ES5
var DateTimePicker = require('react-datetimepicker-bootstrap');

var Example = React.createClass({
  render: function() {
    return (
      <DateTimePicker id="datetimepicker" />
    );
  }
});

// ES6
import DateTimePicker from 'react-datetimepicker-bootstrap';

class Example extends React.Component {
    render() {
        return (
            <DateTimePicker id="datetimepicker" />
        );
    }
}

export default Example;

Props component:

id:

  • Type: string.
  • isRequired:
  • DefaultValue: undefined
  • Description: component id.

icon:

  • Type: string.
  • isRequired:
  • DefaultValue: undefined
  • Description: The position of the icon, accept: left or right.

iconType:

  • Type: string.
  • isRequired:
  • DefaultValue: calendar
  • Description: View the bootstrap iconSet.

placeholder:

  • Type: string.
  • isRequired:
  • DefaultValue: undefined
  • Description: The simple placeholder input.

locale:

  • Type: string.
  • isRequired:
  • DefaultValue: en
  • Description: Translate the calendar e.g.: 'it', 'en', 'ru', ... .

format:

  • Type: string.
  • isRequired:
  • DefaultValue: moment().format()
  • Description: Set the format date view e.g: D/M/YYYY.

minDate:

  • Type: arrayOf(string) or object.
  • isRequired:
  • DefaultValue: undefined
  • Description: Set the minDate start in the calendar, accept: moment() or new Date().

maxDate:

  • Type: arrayOf(string) or object.
  • isRequired:
  • DefaultValue: undefined
  • Description: Set the minDate start in the calendar, accept: moment() or new Date().

disabledDates:

  • Type: arrayOf(string) or object.
  • isRequired:
  • DefaultValue: undefined
  • Description: Disable the dates.

daysOfWeekDisabled:

  • Type: array.
  • isRequired:
  • DefaultValue: undefined
  • Description: Disable a single day in the week, e.g: [0,6].

viewMode:

  • Type: string.
  • isRequired:
  • DefaultValue: days
  • Description: Set the viewMode of the calendar, accept: decades, years, months.

allowInputToggle:

  • Type: boolean.
  • isRequired:
  • DefaultValue: false
  • Description: It'll show the datetimepicker on the textbox focus. If the icon is empty then it's set true.

hasFeedback:

  • Type: boolean.
  • isRequired:
  • DefaultValue: false
  • Description: It show the typical feedback bootstrap style.

bsStyle:

  • Type: string.
  • isRequired:
  • DefaultValue: ''
  • Description: Set the validation color, accept: success, error, warning.

getValue:

  • Type: function.
  • isRequired:
  • DefaultValue: undefined
  • Description: Return the date selected.

inline:

  • Type: boolean.
  • isRequired:
  • DefaultValue: false
  • Description: View the datetimepicker without the modal view.

sideBySide:

  • Type: boolean.
  • isRequired:
  • DefaultValue: false
  • Description: View the datetimepicker without the icon date/time.

calendarWeeks:

  • Type: boolean.
  • isRequired:
  • DefaultValue: false
  • Description: It shows the week of the year to the left of first day of the week.

toolbarPlacement:

  • Type: boolean.
  • isRequired:
  • DefaultValue: false
  • Description: It changes the placement of the icon toolbar.

disabled:

  • Type: boolean.
  • isRequired:
  • DefaultValue: false
  • Description: It disabled the input field.

tooltips:

  • Type: object.
  • isRequired: ✘.
  • DefaultValue:
{
    today: 'Go to today',
    clear: 'Clear selection',
    close: 'Close the picker',
    selectMonth: 'Select Month',
    prevMonth: 'Previous Month',
    nextMonth: 'Next Month',
    selectYear: 'Select Year',
    prevYear: 'Previous Year',
    nextYear: 'Next Year',
    selectDecade: 'Select Decade',
    prevDecade: 'Previous Decade',
    nextDecade: 'Next Decade',
    prevCentury: 'Previous Century',
    nextCentury: 'Next Century'
}
  • Description: This will change the tooltips over each icon to a custom string.

License

MIT (http://www.opensource.org/licenses/mit-license.php)

1.1.2

9 years ago

1.1.1

9 years ago

1.1.0

9 years ago

1.0.0

10 years ago

0.4.1

10 years ago

0.4.0

10 years ago

0.3.1

10 years ago

0.3.0

10 years ago

0.2.1

10 years ago

0.2.0

10 years ago

0.1.0

10 years ago