Skip to content
This repository has been archived by the owner on Feb 22, 2024. It is now read-only.

DatePicker

Kelly edited this page Jul 3, 2018 · 2 revisions

API

Property Description Type Default
dateFormat Sets datepicker date format string 'YYYY-MM-DD'
footer Sets datepicker footer string -
id Sets datepicker id number -
initial_value Sets datepicker inital value string minDate
is_nativepicker Whether to show nativepicker boolean false
maxDate Sets the maximum date object|string 120 years from today
minDate Sets the minimum date object|string Unix Epoch (January 1st 1970)
mode Sets datepicker mode date|duration 'date'
name Sets datepicker input name attribute string -
onChange Callback function for when the selected date is changed function() -
placeholder Sets datepicker input placeholder attribute boolean false
showTodayBtn Whether to show "Today" button boolean false
startDate Sets the start date string false

How to use

const today       = moment().format('YYYY-MM-DD');
const maxDate     = moment().utc().add(120, 'y').format('YYYY-MM-DD');
const minDate     = moment(0).utc().format('YYYY-MM-DD'); // January 1st, 1970

const placeholder = 'Start date';
const footer      = 'This is a footer';

function onChange(e) {
    console.log('change', e.target.value);
}

<DatePicker
    id={1}
    name='date_from'
    initial_value=''
    placeholder={placeholder}
    startDate={today}
    minDate={minDate}
    maxDate={maxDate}
    onChange={onChange}
    is_nativepicker={false}
    showTodayBtn={true}
    footer={footer}
/>
 
Clone this wiki locally