728x90
jQuery UI에서 제공하는 datepicker에서는 기본적으로 날짜를 하나씩 선택하게 되어 있습니다. 간혹 여러 개의 날짜를 선택해야 할 때는 다른 플러그인을 써야 합니다. bootstrap에서 제공하는 datepicker가 있지만 css 문제 때문에 쓰기가 좀 꺼려지더라구요. 그래서 찾은 게 MultiDatesPicker입니다.
css도 기존에 작업해 둔 것과 부딪히지지도 않고 해서 이걸 썼는데 세상에나 datepicker 레이어가 뜬 상태에서 날짜를 선택하면 깜빡임이 있네요. github 가서 검색을 해 보니 이 링크가 있네요. 이걸 $(".date").multiDatesPicker() 호출 전에 써 주면 됩니다.
$(function() {
$.datepicker._selectDateOverload = $.datepicker._selectDate;
$.datepicker._selectDate = function (id, dateStr) {
var target = $(id);
var inst = this._getInst(target[0]);
if (target[0].multiDatesPicker != null) {
inst.inline = true;
$.datepicker._selectDateOverload(id, dateStr);
inst.inline = false;
target[0].multiDatesPicker.changed = false;
} else {
$.datepicker._selectDateOverload(id, dateStr);
target.multiDatesPicker.changed = false;
}
this._updateDatepicker(inst);
};
$(".day-off").multiDatesPicker({
dateFormat: "yy-mm-dd"
});
});
<input type="text" name="day_off" class="day-off">
반응형
'Programming > Javascript' 카테고리의 다른 글
Vue.js is detected on this page. (0) | 2022.01.26 |
---|---|
[jQuery]이미지 첨부 시 미리 보기 (0) | 2021.12.08 |
url, query string 모듈 (0) | 2021.11.19 |
Hello World! (0) | 2021.11.19 |
[jQuery]datepicker에서 date format을 두 가지 이상으로... (0) | 2021.08.19 |