Skip to content

(Deprecated) How to use DatePicker v1

이민규 edited this page Feb 17, 2017 · 1 revision

Deprecated

                                                      Version 1.2.0

Getting started



1. Load javascript files. ```javascript <script type="text/javascript" src="lib/jquery/js/jquery.js"></script> <script type="text/javascript" src="lib/code-snippet/js/code-snippet.js"></script> <script type="text/javascript" src="lib/calendar/js/calendar.min.js"></script> <script type="text/javascript" src="js/datepicker.min.js"></script> ```
2. Create Calendar instance. ```javascript var cal = new tui.component.Calendar({ element: '#layer' }); ```
3. Create DatePicker instance. ```javascript var picker = new tui.component.DatePicker({ element: '#datePick', dateForm: 'yyyy, mm, dd - ', // ex) "2015, 01, 12 - 00:00" date: {year: 2015, month: 11, date: 17}, selectableRanges: [ [{year: 2015, month: 11, date: 17}, {year: 2016, month: 2, date: 15}], [{year: 2016, month: 4, date: 3}, {year: 2016, month:5, date: 1}], [{year: 2016, month: 3, date: 5}, {year: 2016, month:3, date: 17}], [{year: 2016, month: 2, date: 24}, {year: 2016, month:2, date: 26}] ], showAlways: false, useTouchEvent: true, timePicker: new tui.component.TimePicker({ //..TimePicker options }) }, cal); ```