This may seem like a strange topic to blog about, but I believe if it’s happened to me, it could happen to someone else. So here goes…

I was recently working on a commercial product for SharePoint 2010, and one of the requirements in the product was for events to be created in a calendar list where the start and end times were the same. In essence, the events on the calendar were designed to serve as “due date” reminders (zero-duration events).

My first thought was, “Hey, no big deal. I’ll just mark the End Time column as hidden. Then I can use a list item event receiver to set its value equal to the Start Time every time an item is created or modified.” So I went with that approach. Then the problems began.

I went to create a new event, and the ribbon was disabled in the new event dialog window. I also saw a JavaScript error in the status bar of my browser. On top of that, when adding an event from the calendar view using the hover-activated ‘Add’ link, the Start Time was always set to today’s date – it didn’t honor the date I’d clicked on.

Long story short, hiding the built-in End Time column breaks the default ‘New’ and ‘Edit’ list forms for a calendar list.

In the end, since I had a custom list definition I was deploying anyway, I just added custom ‘New’ and ‘Edit’ forms for my list. In both forms, I added the following jQuery code into the ‘PlaceHolderAdditionalPageHead’ content region:

$(document).ready(function() {
    // Hide End Time field
    $('nobr:contains("End Time")').closest('tr').hide();

    // In my case, I also needed to add this call - it initializes the values
    // of the date/time picker fields. Without this, the form would sometimes
    // not submit properly (seemed to be a client-side timing issue... not sure).
    ExecuteOrDelayUntilScriptLoaded(function() {
        SP.UI.ApplicationPages.DateTimeFields.ensureInstance().onChange();
    }, 'sp.ui.applicationpages.calendar.js');
});

That solved the problem nicely. The other change was in my custom list definition, I added a ShowInDisplayForm=’FALSE’ attribute to the <Field> tag for the “EndDate” field. That took care of hiding the field on the display form. The display form doesn’t have the ribbon/JavaScript problem, so hiding the field in a normal way works fine in that case.

(Note: The version of jQuery I used was 1.6.2)