mirror of
https://github.com/frappe/air-datepicker.git
synced 2026-01-14 11:01:22 +08:00
fix onChange event with multiple dates
This commit is contained in:
parent
38e199d5be
commit
7ef2686c3d
35
dist/js/datepicker.js
vendored
35
dist/js/datepicker.js
vendored
@ -22,14 +22,14 @@ var Datepicker;
|
||||
maxData: '',
|
||||
|
||||
//TODO возможно добавить огрнаичивать число выделяемых дат
|
||||
multipleDates: false,
|
||||
multipleDates: true,
|
||||
multipleDatesSeparator: ',',
|
||||
|
||||
// navigation
|
||||
prevHtml: '«',
|
||||
nextHtml: '»',
|
||||
|
||||
// events
|
||||
// TODO сделать с множественными датами
|
||||
onChange: ''
|
||||
};
|
||||
|
||||
@ -81,7 +81,7 @@ var Datepicker;
|
||||
|
||||
_buildDatepickersContainer: function () {
|
||||
this.containerBuilt = true;
|
||||
$body.append('<div class="datepickers-container" id="datepickers-container"></div>')
|
||||
$body.append('<div class="datepickers-container" id="datepickers-container"></div>');
|
||||
$datepickersContainer = $('#datepickers-container');
|
||||
},
|
||||
|
||||
@ -100,9 +100,25 @@ var Datepicker;
|
||||
},
|
||||
|
||||
_triggerOnChange: function (cellType) {
|
||||
var dateString = this.formatDate(this.opts.dateFormat, this.date);
|
||||
var selectedDates = this.selectedDates,
|
||||
parsedSelected = Datepicker.getParsedDate(selectedDates[0]),
|
||||
formattedDates = this.formatDate(this.opts.dateFormat, selectedDates[0]),
|
||||
_this = this,
|
||||
dates = new Date(parsedSelected.year, parsedSelected.month, parsedSelected.date);
|
||||
|
||||
this.opts.onChange(dateString, this.date, this);
|
||||
if (this.opts.multipleDates) {
|
||||
formattedDates = selectedDates.map(function (date) {
|
||||
return _this.formatDate(_this.opts.dateFormat, date)
|
||||
}).join(this.opts.multipleDatesSeparator);
|
||||
|
||||
// Create new dates array, to separate it from original selectedDates
|
||||
dates = selectedDates.map(function(date) {
|
||||
var parsedDate = Datepicker.getParsedDate(date);
|
||||
return new Date(parsedDate.year, parsedDate.month, parsedDate.date)
|
||||
})
|
||||
}
|
||||
|
||||
this.opts.onChange(formattedDates, dates, this);
|
||||
},
|
||||
|
||||
next: function () {
|
||||
@ -137,7 +153,7 @@ var Datepicker;
|
||||
|
||||
formatDate: function (string, date) {
|
||||
var result = string,
|
||||
d = this.parsedDate;
|
||||
d = Datepicker.getParsedDate(date);
|
||||
|
||||
switch (true) {
|
||||
case /dd/.test(result):
|
||||
@ -162,7 +178,6 @@ var Datepicker;
|
||||
selectDate: function (date) {
|
||||
if (this.opts.multipleDates) {
|
||||
if (!this._isSelected(date)) {
|
||||
console.log('push');
|
||||
this.selectedDates.push(date);
|
||||
}
|
||||
} else {
|
||||
@ -458,7 +473,7 @@ Datepicker.Cell = function () {
|
||||
if (Datepicker.isSame(currentDate, date)) _class += ' -current-';
|
||||
if (this.d._isSelected(date, 'day')) _class += ' -selected-';
|
||||
|
||||
return '<div class="' + _class + '" data-date="' + date.getDate() + '">' + date.getDate() + '</div>';
|
||||
return '<div class="' + _class + '" data-date="' + date.getDate() + '" data-month="' + date.getMonth() + '">' + date.getDate() + '</div>';
|
||||
},
|
||||
|
||||
/**
|
||||
@ -560,10 +575,10 @@ Datepicker.Cell = function () {
|
||||
_handleClick: {
|
||||
days: function (el) {
|
||||
var date = el.data('date'),
|
||||
month = el.data('month'),
|
||||
d = this.d.parsedDate;
|
||||
|
||||
this.d.date = new Date(d.year, d.month, date);
|
||||
this.d.selectDate(this.d.date);
|
||||
this.d.selectDate(new Date(d.year, month, date));
|
||||
|
||||
if (this.d.opts.onChange) {
|
||||
this.d._triggerOnChange()
|
||||
|
||||
@ -17,7 +17,8 @@
|
||||
<script type="text/javascript">
|
||||
$('.calendar').datepicker({
|
||||
onChange: function (dateString, date, inst) {
|
||||
|
||||
console.log(dateString);
|
||||
console.log(date[0].getFullYear());
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
@ -94,7 +94,7 @@
|
||||
if (Datepicker.isSame(currentDate, date)) _class += ' -current-';
|
||||
if (this.d._isSelected(date, 'day')) _class += ' -selected-';
|
||||
|
||||
return '<div class="' + _class + '" data-date="' + date.getDate() + '">' + date.getDate() + '</div>';
|
||||
return '<div class="' + _class + '" data-date="' + date.getDate() + '" data-month="' + date.getMonth() + '">' + date.getDate() + '</div>';
|
||||
},
|
||||
|
||||
/**
|
||||
@ -196,10 +196,10 @@
|
||||
_handleClick: {
|
||||
days: function (el) {
|
||||
var date = el.data('date'),
|
||||
month = el.data('month'),
|
||||
d = this.d.parsedDate;
|
||||
|
||||
this.d.date = new Date(d.year, d.month, date);
|
||||
this.d.selectDate(this.d.date);
|
||||
this.d.selectDate(new Date(d.year, month, date));
|
||||
|
||||
if (this.d.opts.onChange) {
|
||||
this.d._triggerOnChange()
|
||||
|
||||
@ -22,7 +22,8 @@ var Datepicker;
|
||||
maxData: '',
|
||||
|
||||
//TODO возможно добавить огрнаичивать число выделяемых дат
|
||||
multipleDates: false,
|
||||
multipleDates: true,
|
||||
multipleDatesSeparator: ',',
|
||||
|
||||
// navigation
|
||||
prevHtml: '«',
|
||||
@ -81,7 +82,7 @@ var Datepicker;
|
||||
|
||||
_buildDatepickersContainer: function () {
|
||||
this.containerBuilt = true;
|
||||
$body.append('<div class="datepickers-container" id="datepickers-container"></div>')
|
||||
$body.append('<div class="datepickers-container" id="datepickers-container"></div>');
|
||||
$datepickersContainer = $('#datepickers-container');
|
||||
},
|
||||
|
||||
@ -100,9 +101,25 @@ var Datepicker;
|
||||
},
|
||||
|
||||
_triggerOnChange: function (cellType) {
|
||||
var dateString = this.formatDate(this.opts.dateFormat, this.date);
|
||||
var selectedDates = this.selectedDates,
|
||||
parsedSelected = Datepicker.getParsedDate(selectedDates[0]),
|
||||
formattedDates = this.formatDate(this.opts.dateFormat, selectedDates[0]),
|
||||
_this = this,
|
||||
dates = new Date(parsedSelected.year, parsedSelected.month, parsedSelected.date);
|
||||
|
||||
this.opts.onChange(dateString, this.date, this);
|
||||
if (this.opts.multipleDates) {
|
||||
formattedDates = selectedDates.map(function (date) {
|
||||
return _this.formatDate(_this.opts.dateFormat, date)
|
||||
}).join(this.opts.multipleDatesSeparator);
|
||||
|
||||
// Create new dates array, to separate it from original selectedDates
|
||||
dates = selectedDates.map(function(date) {
|
||||
var parsedDate = Datepicker.getParsedDate(date);
|
||||
return new Date(parsedDate.year, parsedDate.month, parsedDate.date)
|
||||
})
|
||||
}
|
||||
|
||||
this.opts.onChange(formattedDates, dates, this);
|
||||
},
|
||||
|
||||
next: function () {
|
||||
@ -137,7 +154,7 @@ var Datepicker;
|
||||
|
||||
formatDate: function (string, date) {
|
||||
var result = string,
|
||||
d = this.parsedDate;
|
||||
d = Datepicker.getParsedDate(date);
|
||||
|
||||
switch (true) {
|
||||
case /dd/.test(result):
|
||||
@ -162,7 +179,6 @@ var Datepicker;
|
||||
selectDate: function (date) {
|
||||
if (this.opts.multipleDates) {
|
||||
if (!this._isSelected(date)) {
|
||||
console.log('push');
|
||||
this.selectedDates.push(date);
|
||||
}
|
||||
} else {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user