I'm developing sharepoint hosted app that can fetch events from sharepoint list and put on fullcalendar monthly view. I have suceeded to fetch the events but all calendar events have the default color(blue). I want to assign different color based on the status type( a column in the list).(If it is granted ,it will be green. If it is rejected, it will be red). How can I achieve that ?

my calendar setup partially looks the following:

function CalendarSetup(eventArray) {

schedulecCalendar = $('#myCalendar').fullCalendar({
    header: {
        left: 'prev,next today',
        center: 'title',
        right: ''
    theme: true,
    defaultView: 'month',
    selectable: true,
    events: eventArray,
    selectHelper: true,
    height: 500,
    rendering: true,
    select: function (start, end, allDay) {
        $('#txtDate').datepicker("setDate", new Date(start));
    editable: true      

}); }

eventArray is already fetched from sharpoint list.

Any tips/help would be apperciated.

1 Answer 1


[EDIT: I see you want a coded solution, mine below is for OOTB with SPD but may help you? Not sure]

This is typically done via calendar overlay, where a view exists for each type you want to color code differently. But this requires two lists, one is the "list where the data is" the other is the calendar.

I am accomplishing this task by using a workflow to create/update items on my calendar when they are created/updated on my task list (and vice versa).

In my case, I am using a column of "assigned to" for my color coding as there are only four people in my department.

There are some caveats to this, such as deleting items, where I had to create a column called "delete me" and if checked, the workflow would delete the item. As SharePoint designer (OOTB) has no way to run a workflow on a deleted item action.

You also need a way to ensure the workflow knows what item to touch. I have a column in each list called "ID from other list" which I use to select the correct item. I default the value of "ID from other list" to 0 so my workflow knows a new item from an old one.

If Current Item: Delete Me? equals Yes
    The following actions will run in parallel:
        Delete item in Task List
        and Delete item in Current Item
    then Stop the workflow and log Stopping workflow after delete item
Else if Task Calendar: ID from other list not equals Current Item: ID
and Current Item: ID from other list equals 0
    then Create item in Task List (Output to Variable: create)
    then stop the workflow and log stopping workflow after new item creation
If Current Item: ID equals Task Calendar: ID
    Update item in Task Calendar
    then stop the workflow and log finished updating item
then stop the workflow and log stopping workflow, I reached the end
  • To be honest I haven't developed a workflow so far. So what you have mentioned above is a little bit abstract for me.
    – gunu
    May 19, 2015 at 7:16

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.