我在我的应用程序中使用fullcalendar,并且还拖放Jquery将事件拖到日历中。 它在开发环境中工作正常,但在IIS中发布时无效。 我已经检查过脚本路径是否正确。 似乎所有工作都在我的fullcalendar对象中的eventDrop和eventReceive之外。
这是我的全日历代码:
$('#calendar').fullCalendar({
height: $(window).height() * 0.90,
scrollTime: "08:00:00", // Starting hours scroll starts in the view
timezone: 'local',
navLinks: true, // can click day/week names to navigate views
eventLimit: true, // limit events in a cell for all non-agenda views
aspectRatio: 2.50, // control the day cell height in month view
schedulerLicenseKey: 'CC-Attribution-NonCommercial-NoDerivatives',
allDaySlot: false, // remove "all days" cell
titleRangeSeparator: " - ",
header: {
left: 'next,prev today',
center: 'title',
right: 'agendaDay,agendaFiveDay,week1,month1'
},
slotLabelFormat: 'H:mm',
defaultView: "agendaFiveDay",
editable: true,
droppable: true, // this allows things to be dropped onto the calendar
// triggered when a drop activity from an external source occurs
eventReceive: function (event) {
addActivity(event.start, event.resourceId, event.docNum, event.docType, event.title, event.tooltipContent, shifted, g_psDb, g_sUser, function (addActivityResult) {
if (addActivityResult.Message != "OK") {
toastr["error"](addActivityResult.Message)
$('#calendar').fullCalendar('removeEvents', event._id)
}
else {
// set the activity id of the new added activity recieved from the DB
event.id = addActivityResult.ActivityId;
// remove the dropped item from the open tasks list in the view
elements = $('#openActivities .item')
$.each(elements, function (i) {
if ($(this).data('event').docNum == event.docNum) {
$(this).remove();
}
});
}
})
},
eventRender: function (event, element) {
element.css("background-color", event.color);
// create the tooltip for each event
s = moment(event.start).format("HH:mm");
e = moment(event.end).format("HH:mm");
element.qtip({
content: {
text: event.tooltipContent,
title: e + ' - ' + s
},
style: 'qtip-bootstrap', // Give it some style
position: {
my: 'left center',
at: 'right middle'
},
show: {
delay: 500, solo: true
},
hide: {
when: 'mouseout', delay: 400
}
})
// Create context menu when right clicking an activity, ignore when it is background activity
element.bind('mousedown', function (e) {
if ((e.which == 3) && (this.className != "fc-bgevent")) {
$('#menu').hide();
$('#menu').css({ 'top': e.pageY - 50, 'left': e.pageX, 'position': 'absolute', 'border': '1px solid black' });
$('#menu').data("element", element) // pass the DOM element to the menu
$('#menu').data("event", event) // pass the activity OBJECT to the menu
$('#menu').show();
}
});
},
eventAfterAllRender: function (view) {
// give background color to even days
if (view.name == 'week1' || view.name == "agendaFiveDay" || view.name == "agendaFourDay" || view.name == "agendaTwoDay") {
$.each($("td"), function () {
var date = $(this).attr("data-date");
if (typeof date != "undefined" && date != false) {
// If element has thiViewss attribute
date = new Date(date);
var day = date.getDate().toString();
if (day % 2 == 0)
$(this).css("background-color", "#f6f6f6");
}
})
}
},
views: {
month1: {
type: 'month',
duration: { months: 1 },
// group by day FIRST with resources underneath
groupByDateAndResource: true
},
week1: {
titleFormat: 'YYYY, D MMMM', // The date format for this view
type: 'agenda',
duration: { weeks: 1 },
/// group by day FIRST with resources underneath
groupByDateAndResource: true,
columnFormat: "ddd D/M"
},
agendaFourDay: {
titleFormat: 'YYYY, D MMMM', // The date format for this view
type: 'agenda',
duration: { days: 4 },
groupByDateAndResource: true,
columnFormat: "ddd D/M"
},
agendaFiveDay: {
titleFormat: 'YYYY, D MMMM', // The date format for this view
type: 'agenda',
duration: { weeks: 1 },
groupByDateAndResource: true,
columnFormat: "ddd D/M",
hiddenDays: [5, 6] // don't show Friday and Sautarday
},
agendaTwoDay: {
titleFormat: 'YYYY, D MMMM', // The date format for this view
type: 'agenda',
duration: { days: 2 },
groupByDateAndResource: true
}
},
resources: [], // This line must be here to implemet resources in the calendar
eventSources: [
{
events: function (start, end, timezone, callback) {
var startDate = new Date(start);
var endDate = new Date(end);
getFixedActivities(startDate, endDate, function (events) {
callback(events)
})
}
},
{
events: function (start, end, timezone, callback) {
var startDate = new Date(start);
var endDate = new Date(end);
getAvailableHours(startDate, endDate, function (events) {
callback(events)
})
},
color: 'green' // TODO: set as database variable
}
],
// trigers each time an activity resizes
eventResize: function (event, delta, revertFunc) {
updateActivity(event, shifted, function (activityResult) {
if (activityResult.Message != "OK") {
// alert(activityResult.Message)
toastr["error"](activityResult.Message)
revertFunc();
}
})
},
// triggers every time an internal activity being moved
eventDrop: function (event, delta, revertFunc) {
updateActivity(event, shifted, function (activityResult) {
if (activityResult.Message != "OK") {
//alert(activityResult.Message)
toastr["error"](activityResult.Message)
revertFunc();
}
})
}
});
function OnSuccess(response) {
$("#openActivities").empty();
var activities = response.d;
$(activities).each(function (i) {
// format the date
var dueDate = new Date(parseInt(this.DueDate.substr(6)));
dueDate = dueDate.toLocaleDateString();
// Create list item with the data retrieved
var $element = $("<li class='item'>" + this.WebListItem + "</li>");
// add the created item to the list
$("#openActivities").append($element);
// animation of adding items to open activities list
$element.delay(200 * i).animate({ opacity: 1 }).slideDown('slow');
// store data on the list item so the calendar will be able get it later
$element.data('event', {
title: this.Content, // Use the title input as the event title
duration: "01:00", // The duration in HH:mm format
docType: this.DocType,
docNum: this.DocNum,
color: g_defaultStatusColor,
tooltipContent: this.TooltipContent,
cancel: false // will determine if to remove the event from the calendar
});
// make the event draggable using jQuery UI
$element.draggable({
containment: 'window',
scroll: false,
helper: 'clone',
revert: true, // will cause the event to go back to its
revertDuration: 0, // original position after the drag
start: function () {
$(this).css("cursor", "pointer");
$(this).css("opacity", 0.4);
},
stop: function () {
$(this).css("opacity", 1);
}
})
})
}