@daracl/datetimepicker v0.0.9

DateTimePicker

An easy to use lightweight javascript calendar library.

Browser Support

Latest ✔	Latest ✔	Latest ✔	Latest ✔	Latest ✔

Installation

npm install @daracl/datetimepicker

OR

yarn add @daracl/datetimepicker

or download zip

start

npm start

build

npm run build

datetimepicker 사용방법

// 언어 설정
Daracl.dateTimePicker.setDefaultFormat({
    date: 'YYYY.MM.DD'
    , datetime: "YYYY.MM.DD HH:mm"
})

Daracl.dateTimePicker.setMessage({
    year: '년',
    month: '월',
    day: '일',
    am: "오전",
    pm: "오후",
    today: '오늘',
    ok: '선택',
    months: {
    full: ["1월", "2월", "3월", "4월", "5월", "6월", "7월", "8월", "9월", "10월", "11월", "12월"],
    abbr: ["1월", "2월", "3월", "4월", "5월", "6월", "7월", "8월", "9월", "10월", "11월", "12월"]
    },
    weeks: {
    full: ["일요일", "월요일", "화요일", "수요일", "목요일", "금요일", "토요일"],
    abbr: ["일", "월", "화", "수", "목", "금", "토"]
    },
});

Daracl.dateTimePicker.create('#dateText', {
    //initialDate: '2023-08-10' // 초기화 요일
    aaa: 11
    , mode: 'date'
    , minDate: Daracl.dateTimePicker.parser('2023.08.05')
    , maxDate: Daracl.dateTimePicker.parser('2050.09.30')

    , onSelect: (dt) => {
    console.log(dt);
    //return false; 
    }
    , onClose: (dt) => {
    console.log(dt);
    //return false;
    }

    , zIndex: 1000
}, {
    ok: "Ok"
})

Daracl.dateTimePicker.create('#datetimeText', { initialDate: new Date(), mode: 'datetime' });

Daracl.dateTimePicker.create('#timeText', { initialDate: new Date(), mode: 'time' });

Daracl.dateTimePicker.create('#monthText', {
    initialDate: new Date(), format: 'YYYY-MM-DD', mode: 'month', afterChangeDatepicker: (dt, mode) => {
    console.log('monthText afterChangeDatepicker', dt, mode);
    }
});

Daracl.dateTimePicker.create('#yearText', {
    initialDate: new Date(), format: 'YYYY', mode: 'year', afterChangeDatepicker: (dt, mode) => {
    console.log('yearText afterChangeDatepicker', dt, mode);
    }
});


var aaa = Daracl.dateTimePicker.create('#date', {
    inline: true
    , showMonthAfterYear: true
    , mode: 'datetime'
    //, weekStartDay: 1
    , minDate: Daracl.dateTimePicker.parser('2023-08-05')
    , maxDate: Daracl.dateTimePicker.parser('2025-09-30')
    //, isRTL: true
    , initialDate: new Date() // 초기화 요일
    , onSelect: (dt, mode, e) => {
    console.log('select', dt, mode, e);
    }
    , beforeChangeDatepicker: (dt, callbackFn) => {
    console.log('beforeChangeDatepicker', dt);

    setTimeout(function () {
        callbackFn(true);
    }, 10)

    return false;
    }
    , afterChangeDatepicker: (dt, mode) => {
    console.log('afterChangeDatepicker', dt, mode);
    }
    , beforeDrawDate: (dt) => {
    //return false; 
    return {
        style: '111',
        //check: true,
        //, tooltip: dt.date
    }
    }
    , zIndex: 1000
});

Options

Language

License

Darainfo is under MIT License.