我正在使用基斯木日历。在这里,我有数据库中的某些日期,我想突出显示事件并在悬停时显示事件。我该怎么做我尝试从jquery日历示例中跟随示例,但无济于事。我现在尝试跟进。
$.ajax({
url : '<?php echo base_url('event_date') ?>',
type: 'POST',
data: {lang_type : lang_id},
datatype : 'JSON',
success : function(data){
var events = JSON.parse(data);
console.log(events);
$('#englishPicker').calendarsPicker({
calendar: $.calendars.instance('gregorian', 'en'),
inline: true,
useMouseWheel: false,
nextText : 'Next',
prevText: 'Previous',
todayText: 'Today',
onDate : function(date) {
var result = [true, '', null];
var matching = $.grep(events, function(event) {
return event.date.valueOf() === date.valueOf();
});
if (matching.length) {
result = [true, 'highlight', null];
}
return result;
},
onSelect: function(dateText) {
var date,
selectedDate = new Date(dateText),
i = 0,
event = null;
while (i < events.length && !event) {
date = events[i].date;
if (selectedDate.valueOf() === date.valueOf()) {
event = events[i];
}
i++;
}
if (event) {
alert(event.event);
}else{
alert('no event');
}
}
})
},
error : function(xhr, status, error){
alert(error);
return false;
}
})
console.events returns
[Object { event="event 1", date="2014-02-03"}, Object { event="event 2", date="2014-02-06"}, Object { event="event at falgun", date="2014-02-14"}, Object { event="dfasf", date="2014-02-07"}]
我如何解决这个问题?欢迎任何帮助/建议。谢谢。
答案 0 :(得分:1)
找到问题的解决方案。只需按如下方式编辑代码:
$.ajax({
url : '<?php echo base_url('event_date') ?>',
type: 'POST',
data: {lang_type : lang_id},
datatype : 'JSON',
success : function(data){
var events = JSON.parse(data);
console.log(events);
$('#englishPicker').calendarsPicker({
calendar: $.calendars.instance('gregorian', 'en'),
inline: true,
useMouseWheel: false,
nextText : 'Next',
prevText: 'Previous',
todayText: 'Today',
onDate: function(date, inMonth) {
if (inMonth) {
for (i = 0; i < events.length; i++) {
var a = events[i].split('-');
if (date.year() == a[0] && date.month() == a[1] && date.day() == a[2]) {
return {selectable: true, dateClass: 'highlight-custom', title: a[3]};
}
}
}
return [true, ''];
}
})
},
error : function(xhr, status, error){
alert(error);
return false;
}
});
console.log(events) give data as
["2014-02-03-event 1",
"2014-02-06-event 2",
"2014-02-14-event at falgun",
"2014-02-07-dfasf"]