logo

/Date Picker|v4.0.0

Class

new DateRangePicker(options)index.jsline 58

PARAMETERS
NameTypeDescription

options

object

Date-Range picker options

PROPERTIES
NameTypeDescription

startpicker

object

Startpicker options

PROPERTIES
NameTypeDescription

input

HTMLElementstring

Startpicker input element or selector

container

HTMLElementstring

Startpicker container element or selector

endpicker

object

Endpicker options

PROPERTIES
NameTypeDescription

input

HTMLElementstring

Endpicker input element or selector

container

HTMLElementstring

Endpicker container element or selector

format

string

Input date-string format

type

string = 'date'

DatePicker type - ('date' | 'month' | 'year')

language

string = 'en'

Language key

timePicker

[ objectboolean ]

calendar

[ object ]

Calendar options

selectableRanges

[ Array ]

Selectable ranges

showAlways

boolean = false

Whether the datepicker shows always

autoClose

boolean = true

Close after click a date

usageStatistics

Boolean = true|false

send hostname to google analytics default value is true

EXAMPLES
var DatePicker = tui.DatePicker; // or require('tui-date-picker');
var rangepicker = DatePicker.createRangePicker({
    startpicker: {
        input: '#start-input',
        container: '#start-container'
    },
    endpicker: {
        input: '#end-input',
        container: '#end-container'
    },
    type: 'date',
    format: 'yyyy-MM-dd'
    selectableRanges: [
        [new Date(2017, 3, 1), new Date(2017, 5, 1)],
        [new Date(2017, 6, 3), new Date(2017, 10, 5)]
    ]
});

Instance Methods

addRange(start, end)index.jsline 310

Add a range

PARAMETERS
NameTypeDescription

start

Datenumber

startDate

end

Datenumber

endDate

changeLanguage(language)index.jsline 332

Change language

PARAMETERS
NameTypeDescription

language

string

Language

destroy()index.jsline 340

Destroy date-range picker

getEndDate()index.jsline 282

Returns end-date

RETURNS:
{

Date

}

getEndpicker()index.jsline 258

Returns end-datepicker

RETURNS:
{

DatePicker

}

getStartDate()index.jsline 274

Returns start-date

RETURNS:
{

Date

}

getStartpicker()index.jsline 250

Returns start-datepicker

RETURNS:
{

DatePicker

}

removeRange(start, end, type)index.jsline 322

Remove a range

PARAMETERS
NameTypeDescription

start

Datenumber

startDate

end

Datenumber

endDate

type

null'date''month''year'

Range type, If falsy -> Use strict timestamp;

setEndDate(date)index.jsline 290

Set end date

PARAMETERS
NameTypeDescription

date

Date

End date

setRanges(ranges)index.jsline 299

Set selectable ranges

PARAMETERS
NameTypeDescription

ranges

Array.<Array.<numberDate>>

Selectable ranges

setStartDate(date)index.jsline 266

Set start date

PARAMETERS
NameTypeDescription

date

Date

Start date

Events

change:endindex.jsline 243

EXAMPLES
rangepicker.on('change:end', function() {
    console.log(rangepicker.getEndDate());
});

change:startindex.jsline 227

EXAMPLES
rangepicker.on('change:start', function() {
    console.log(rangepicker.getStartDate());
});
Resizable