Я использую средство выбора диапазона дат и хочу отображать только год и месяц и искать начальный и конечный месяц, но он не работает должным образом.
Как я могу изменить его, чтобы он работал так, как я хочу ?
Мне нужен экран, как показано ниже
введите описание изображения здесь
Мой экран такой
введите описание изображения здесь
$('.ui-datepicker-trigger').click(function () {
var $td = $(this).closest('td');
var $inputs = $td.find('input');
var $startInput = $inputs.eq(0); // 첫 번째 input
var $endInput = $inputs.eq(1); // 두 번째 input
if ($inputs.length >= 2) {
var startInputClass = $startInput.attr('class');
if (startInputClass.includes('monthRangePicker')){
// 월 선택기 설정
$inputs.daterangepicker({
autoUpdateInput: false,
locale: {
format: 'YYYY-MM',
separator: ' ~ ',
applyLabel: '확인',
cancelLabel: '취소',
fromLabel: 'From',
toLabel: 'To',
customRangeLabel: '직접 설정',
weekLabel: 'W',
daysOfWeek: ['일', '월', '화', '수', '목', '금', '토'],
monthNames: ['1월', '2월', '3월', '4월', '5월', '6월', '7월', '8월', '9월', '10월', '11월', '12월']
},
drops: 'auto', // DateRangePicker의 드롭다운 방향을 자동으로 설정
showDropdowns: true,
}).on('apply.daterangepicker', function (ev, picker) {
$startInput.val(picker.startDate.format('YYYY-MM'));
$endInput.val(picker.endDate.format('YYYY-MM'));
// 위치 조정 로직을 apply 이벤트에도 적용
var offset = $startInput.offset();
picker.container.css({
top: offset.top + $startInput.outerHeight(),
left: offset.left
});
}).on('show.daterangepicker', function (ev, picker) {
// 위치 조정 로직을 show 이벤트에도 적용
var offset = $startInput.offset();
picker.container.css({
top: offset.top + $startInput.outerHeight(),
left: offset.left
});
// 달력의 월 선택 버튼에 이벤트 추가
picker.container.find('.drp-calendar.left .month').off('click').on('click', function (e) {
var monthIndex = $(this).index();
var year = picker.leftCalendar.month.year();
var startDate = moment([year, monthIndex, 1]);
picker.setStartDate(startDate);
$startInput.val(startDate.format('YYYY-MM'));
});
picker.container.find('.drp-calendar.right .month').off('click').on('click', function (e) {
var monthIndex = $(this).index();
var year = picker.rightCalendar.month.year();
var endDate = moment([year, monthIndex]).endOf('month');
picker.setEndDate(endDate);
$endInput.val(endDate.format('YYYY-MM'));
});
});
}
$inputs.data('daterangepicker').toggle();
}
});
Подробнее здесь: https://stackoverflow.com/questions/785 ... -and-month
Daterangepicker Только год и месяц [дубликат] ⇐ Jquery
Программирование на jquery
-
Anonymous
1716974535
Anonymous
Я использую средство выбора диапазона дат и хочу отображать только год и месяц и искать начальный и конечный месяц, но он не работает должным образом.
Как я могу изменить его, чтобы он работал так, как я хочу ?
Мне нужен экран, как показано ниже
введите описание изображения здесь
Мой экран такой
введите описание изображения здесь
$('.ui-datepicker-trigger').click(function () {
var $td = $(this).closest('td');
var $inputs = $td.find('input');
var $startInput = $inputs.eq(0); // 첫 번째 input
var $endInput = $inputs.eq(1); // 두 번째 input
if ($inputs.length >= 2) {
var startInputClass = $startInput.attr('class');
if (startInputClass.includes('monthRangePicker')){
// 월 선택기 설정
$inputs.daterangepicker({
autoUpdateInput: false,
locale: {
format: 'YYYY-MM',
separator: ' ~ ',
applyLabel: '확인',
cancelLabel: '취소',
fromLabel: 'From',
toLabel: 'To',
customRangeLabel: '직접 설정',
weekLabel: 'W',
daysOfWeek: ['일', '월', '화', '수', '목', '금', '토'],
monthNames: ['1월', '2월', '3월', '4월', '5월', '6월', '7월', '8월', '9월', '10월', '11월', '12월']
},
drops: 'auto', // DateRangePicker의 드롭다운 방향을 자동으로 설정
showDropdowns: true,
}).on('apply.daterangepicker', function (ev, picker) {
$startInput.val(picker.startDate.format('YYYY-MM'));
$endInput.val(picker.endDate.format('YYYY-MM'));
// 위치 조정 로직을 apply 이벤트에도 적용
var offset = $startInput.offset();
picker.container.css({
top: offset.top + $startInput.outerHeight(),
left: offset.left
});
}).on('show.daterangepicker', function (ev, picker) {
// 위치 조정 로직을 show 이벤트에도 적용
var offset = $startInput.offset();
picker.container.css({
top: offset.top + $startInput.outerHeight(),
left: offset.left
});
// 달력의 월 선택 버튼에 이벤트 추가
picker.container.find('.drp-calendar.left .month').off('click').on('click', function (e) {
var monthIndex = $(this).index();
var year = picker.leftCalendar.month.year();
var startDate = moment([year, monthIndex, 1]);
picker.setStartDate(startDate);
$startInput.val(startDate.format('YYYY-MM'));
});
picker.container.find('.drp-calendar.right .month').off('click').on('click', function (e) {
var monthIndex = $(this).index();
var year = picker.rightCalendar.month.year();
var endDate = moment([year, monthIndex]).endOf('month');
picker.setEndDate(endDate);
$endInput.val(endDate.format('YYYY-MM'));
});
});
}
$inputs.data('daterangepicker').toggle();
}
});
Подробнее здесь: [url]https://stackoverflow.com/questions/78548408/daterangepicker-only-year-and-month[/url]
Ответить
1 сообщение
• Страница 1 из 1
Перейти
- Кемерово-IT
- ↳ Javascript
- ↳ C#
- ↳ JAVA
- ↳ Elasticsearch aggregation
- ↳ Python
- ↳ Php
- ↳ Android
- ↳ Html
- ↳ Jquery
- ↳ C++
- ↳ IOS
- ↳ CSS
- ↳ Excel
- ↳ Linux
- ↳ Apache
- ↳ MySql
- Детский мир
- Для души
- ↳ Музыкальные инструменты даром
- ↳ Печатная продукция даром
- Внешняя красота и здоровье
- ↳ Одежда и обувь для взрослых даром
- ↳ Товары для здоровья
- ↳ Физкультура и спорт
- Техника - даром!
- ↳ Автомобилистам
- ↳ Компьютерная техника
- ↳ Плиты: газовые и электрические
- ↳ Холодильники
- ↳ Стиральные машины
- ↳ Телевизоры
- ↳ Телефоны, смартфоны, плашеты
- ↳ Швейные машинки
- ↳ Прочая электроника и техника
- ↳ Фототехника
- Ремонт и интерьер
- ↳ Стройматериалы, инструмент
- ↳ Мебель и предметы интерьера даром
- ↳ Cантехника
- Другие темы
- ↳ Разное даром
- ↳ Давай меняться!
- ↳ Отдам\возьму за копеечку
- ↳ Работа и подработка в Кемерове
- ↳ Давай с тобой поговорим...
Мобильная версия