[jQuery]datepicker에서 여러 날짜 선택할 수 있게
Javascript 2021. 12. 2. 14:48
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">
반응형
'Javascript' 카테고리의 다른 글
Uncaught SyntaxError: Cannot use import statement outside a module (0) | 2022.01.27 |
---|---|
[jQuery]이미지 첨부 시 미리 보기 (0) | 2021.12.08 |
[jQuery]datepicker에서 여러 날짜 선택할 수 있게 (0) | 2021.12.02 |
[jQuery]datepicker에서 date format을 두 가지 이상으로... (0) | 2021.08.19 |
반복문 내에서 탈출(?)하기 (0) | 2021.07.22 |
하이브리드 앱으로 접속을 했는지, 모바일 브라우저로 접속했는지... (0) | 2021.04.06 |