我有使用SharePoint Online 2013的spservices和fullcalendar。它会引入事件。我引用了下面列出的以下文件和代码。任何有关我缺少的帮助将不胜感激。
<link rel="stylesheet" type="text/css" href="/Custom2013/css/fullcalendar.css" />
<link rel="stylesheet" type="text/css" href="/Custom2013/css/fullcalendar.print.css" media="print" />
<script type="text/javascript" src="/Custom2013/js/jquery-1.8.1.min.js"></script>
<script type="text/javascript" src="/Custom2013/js/moment.min.js"></script>
<script type="text/javascript" src="/Custom2013/js/jquery-ui.custom.min.js"></script>
<script type="text/javascript" src="/Custom2013/js/jquery.SPServices-2014.01.min.js"></script>
<script type="text/javascript" src="/Custom2013/js/fullcalendar.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#calendar').fullCalendar({
// Assign buttons to the header of the calendar. See FullCalendar documentation for details.
header: {
left: 'prev,next today',
center: 'title',
right: 'month, basicWeek, basicDay'
},
defaultView: "month", // Set the default view to month
firstHour: "6", // Set the first visible hour in agenda views to 5 a.m.
// Set the height of the calendar in pixels
weekMode: "liquid", // Only display the weeks that are needed
editable: false, // Set the calendar to read-only; events can't be dragged or resized
// Add events to the calendar. This is where the "magic" happens!
events: function(start, end, timezone, callback) {
// Create an array to hold the events.
var events = [];
// Set the date from which to pull events based on the first visible day in the current calendar view. For a month view, this will usually be several days into the previous month. We can use FullCalendar's built-in getView method along with the formatDate utility function to create a date string in the format that SharePoint requires. It must be in the format YYYY-MM-DDTHH:MM:SSZ. Due to time zone differences, we will omit everything after the day.
var startDate = moment().format($('#calendar').fullCalendar('getView').intervalstart, "u").split("T")[0];
// Get the current view of the calendar (agendaWeek, agendaDay, month, etc.). Then set the camlView to the appropriate value to pass to the web service. This way we will only retrieve events needed by the current view (e.g. the agendaWeek view will only retrieve events during the current week rather than getting all events for the current month).
var calView = $('#calendar').fullCalendar('getView');
var camlView = "";
switch (calView) {
case "basicWeek":
camlView = "<Week />";
break;
case "basicDay":
camlView = "<Week />";
break;
default:
// Default to month view
camlView = "<month />";
break;
}
// Make the web service call to retrieve events.
$().SPServices({
operation: "GetListItems",
async: false,
listName: "Stores Calendar",
CAMLViewFields: "<ViewFields>" +
"<FieldRef Name='Title' />" +
"<FieldRef Name='EventDate' />" +
"<FieldRef Name='EndDate' />" +
"<FieldRef Name='Description' />" +
"<FieldRef Name='fRecurrence' />" +
"<FieldRef Name='RecurrenceData' />" +
"<FieldRef Name='fAllDayEvent' />" +
"<FieldRef Name='Add_x0020_to_x0020_Workload_x002' />" +
"</ViewFields>",
CAMLQuery: "<Query>" +
"<Where>" +
"<Eq>" +
"<FieldRef Name='Add_x0020_to_x0020_Workload_x002' />" +
"<Value Type='Choice'>" + "Yes" + "</Value>" +
"</Eq>" +
"<And>" +
"<DateRangesOverlap>" +
"<FieldRef Name='EventDate' />" +
"<FieldRef Name='EndDate' />" +
"<FieldRef Name='RecurrenceID' />" +
"<Value Type='DateTime'>" +
"<month />" +
"</Value>" +
"</DateRangesOverlap>" +
"</And>" +
"</Where>" +
"<OrderBy>" +
"<FieldRef Name='EventDate' />" +
"</OrderBy>" +
"</Query>",
CAMLQueryOptions: "<QueryOptions>" +
"<CalendarDate>" + start + "</CalendarDate>" +
"<RecurrencePatternXMLVersion>v3</RecurrencePatternXMLVersion>" +
"<ExpandRecurrence>TRUE</ExpandRecurrence>" +
"</QueryOptions>",
completefunc: function (xData, Status) {
var events = [];
$(xData.responseXML).SPFilterNode("z:row").each(function () {
var $node = $(this),
fADE = $node.attr("ows_fAllDayEvent") || 0,
thisADE = (fADE === 0),
thisID = $node.attr("ows_ID"),
sepID = thisID.indexOf(';#'),
thisTitle = $node.attr("ows_Title"),
thisRecurrence = $node.attr("ows_fRecurrence"),
thisDesc = $node.attr("ows_Description");
if (sepID != -1) thisID = thisID.substring(0,sepID);
var thisUrl = "DispForm.aspx?ID=" + thisID,
thisClass = thisTitle.replace(" ","").substr(0,10).replace(",","").replace(" ","") + thisID,
thisRD = $node.attr("ows_RecurrenceData");
// if working with FullCalendar or building an events object for another purpose...
events.push({
title: thisTitle,
start: $node.attr("ows_EventDate"),
end: $node.attr("ows_EndDate"),
allDay: thisADE,
url: thisUrl,
description: $(thisDesc).text()
});
});
callback(events);
}
});
}
});
});
</script>