我正在尝试根据所选的时间段在正确的位置显示事件。因此,一旦创建了事件,它就会以正确的时间段保存在数据库中,但是当它显示它们时,它们都显示在顶部作为全天事件而不是作为常规事件在数据库中显示它们的时间
这是来自events.php的var_dump
[{"id":"1","title":"Umar","start":"2016-03-15 00:00:00","end":"2016-03-18 00:00:00","url":"www.ua.com","allDay":"false"},{"id":"2","title":"Abdullah","start":"2016-04-04 00:00:00","end":"2016-04-04 00:00:00","url":"www.abdullah.com","allDay":"false"},{"id":"7","title":"Abou AbdurRahman","start":"2016-05-09 00:00:00","end":"2016-05-13 00:00:00","url":null,"allDay":"false"},{"id":"12","title":"Abdullah","start":"2016-05-17 03:00:00","end":"2016-05-17 11:30:00","url":null,"allDay":"false"},{"id":"13","title":"Ahmad","start":"2016-05-18 01:00:00","end":"2016-05-18 06:00:00","url":null,"allDay":"false"},{"id":"14","title":"Abdullah Break","start":"2016-05-19 10:00:00","end":"2016-05-19 16:00:00","url":null,"allDay":"false"},{"id":"15","title":"asd","start":"2016-05-20 07:00:00","end":"2016-05-20 12:30:00","url":null,"allDay":"false"}]
以下是日历的事件呈现:
var calendar = $('#calendar').fullCalendar({
editable: true,
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay'
},
defaultView:'agendaWeek',
events: "events.php",
timeFormat: 'h:mm',
displayEventEnd :true,
// Convert the allDay from string to boolean
eventRender: function(event, element, view) {
event.allDay = false;
},
selectable: true,
selectHelper: true,
select: function(start, end, allDay) {
var title = prompt('Event Title:');
if (title) {
var start = $.fullCalendar.moment(start).format('YYYY-MM-DD, h:mm:ss a');
var end = $.fullCalendar.moment(end).format('YYYY-MM-DD, h:mm:ss a');
console.log("Event Triggered");
$.ajax({
url: "add_events.php",
data: 'title='+ encodeURIComponent(title)+
'&start='+encodeURIComponent(start)+
'&end='+encodeURIComponent(end),
// + '&url='+ encodeURIComponent(url),
type: 'POST',
dataType:'text',
success: function(json) {
alert('Added Successfully');
},
error: function(xhr, textStatus, errorThrown) {
alert(xhr.responseText);
}
});
calendar.fullCalendar('renderEvent',
{
title: title,
start: start,
end: end,
// url:url,
allDay: allDay
},
true // make the event "stick"
);
}
calendar.fullCalendar('unselect');
}
任何有助于深入了解此问题的人都将不胜感激。
此致 欧麦尔
答案 0 :(得分:0)
$('#txtStartDate').datepicker({
changeMonth: true,
changeYear: true,
dateFormat: 'MM yy',
showButtonPanel: true,
yearRange: "-3:+1",
onClose: function () {
var iMonth = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
var iYear = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
$('#hdnStartMonth').val(parseInt(iMonth) + 1);
$('#hdnStartYear').val(iYear);
$(this).datepicker('setDate', new Date(iYear, iMonth, 1));
if (parseInt($('#hdnEndYear').val()) < parseInt($('#hdnStartYear').val())) {
$('#txtStartDate').val('');
} else if (parseInt($('#hdnEndYear').val()) == parseInt($('#hdnStartYear').val())) {
if (parseInt($('#hdnEndMonth').val()) < parseInt($('#hdnStartMonth').val())) {
$('#txtStartDate').val('');
}
}
},
beforeShow: function () {
if ((selDate = $(this).val()).length > 0) {
iYear = selDate.substring(selDate.length - 4, selDate.length);
iMonth = jQuery.inArray(selDate.substring(0, selDate.length - 5),
$(this).datepicker('option', 'monthNames'));
$(this).datepicker('option', 'defaultDate', new Date(iYear, iMonth, 1));
$(this).datepicker('setDate', new Date(iYear, iMonth, 1));
}
}
});
$('#txtEndDate').datepicker({
changeMonth: true,
changeYear: true,
dateFormat: 'MM yy',
showButtonPanel: true,
yearRange: "-3:+1",
onClose: function () {
var iMonth = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
var iYear = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
$('#hdnEndMonth').val(parseInt(iMonth) + 1);
$('#hdnEndYear').val(iYear);
$(this).datepicker('setDate', new Date(iYear, iMonth, 1));
if (parseInt($('#hdnEndYear').val()) < parseInt($('#hdnStartYear').val())) {
$('#txtEndDate').val('');
} else if (parseInt($('#hdnEndYear').val()) == parseInt($('#hdnStartYear').val())) {
if (parseInt($('#hdnEndMonth').val()) < parseInt($('#hdnStartMonth').val())) {
$('#txtEndDate').val('');
}
}
},
beforeShow: function () {
if ((selDate = $(this).val()).length > 0) {
iYear = selDate.substring(selDate.length - 4, selDate.length);
iMonth = jQuery.inArray(selDate.substring(0, selDate.length - 5),
$(this).datepicker('option', 'monthNames'));
$(this).datepicker('option', 'defaultDate', new Date(iYear, iMonth, 1));
$(this).datepicker('setDate', new Date(iYear, iMonth, 1));
}
}
});