Thursday, September 11, 2008

Display concatenated columns in Calendar view and customize pages for adding or editing list items

In this post, I am going to talk about two things:

- How to display more than one columns in SharePoint Calendar view

- How to customize ASPX pages/forms used for adding, editing or displaying list items using SharePoint Designer

So let’s start with how to display concatenated columns in Calendar view. Here is the simple Calendar Month view,

First requirement is, I want to add an additional column for organizer of the event and display title and time instead of just title in Calendar month view. I am going to add “Organizer” column to Calendar by creating a new column and selecting “People or Group” in column type so that I can select organizer of an event from AD users. Also it is set to display name of a person in organizer column.

As shown below, I can select organizer from AD users now,

My second requirement is to display more than one column in Calendar month view. I want to display “Title” and “Time” instead of just “Title”. So create a new column for the Calendar and select “Calculated (calculation based on other columns)” for column type. Next step is to define formula for this column. I have used following formula,

=Title&" | "&TEXT ([Start Time],"HH:MM AM/PM") &"-"&TEXT ([End Time],"HH:MM AM/PM")

Which will convert start time and end time to “Hours: Minutes AM/PM” string and then append it to “Title” of the event.

Finally I need to change column to display in month view of Calendar to “TitleAndTime” as shown below,

That’s it! You are done. Now you can see “Title” and “Time” in month view of Calendar.

Now, let’s see how we can customize ASPX pages (forms) to add, edit or display list items. I will walk you through the steps for customizing “NewForm.aspx” for adding a new event to a Calendar. To start with let’s open that SharePoint site in SharePoint Designer 2007. Once the SharePoint site is opened in SharePoint Designer, Go to the “Lists” and expand “Calendar”, Right click on “NewForm.aspx” and select “New From Existing Page” as shown below,

I would recommend you to save this page with different name at the same location - “Lists > Calendar”. So that “NewForm.aspx” page will remain intact and you will have an option to switch it back to original page in case you mess up this form while customizing it. So I am going to store it as “NewForm2.aspx”

Now we can start customizing “NewForm.aspx” page. The requirement is to keep only Title, Location, Start Time, End Time and Organizer columns and delete the rest. Here are the steps,

Select “PlaceHolderMain (Custom)” and click “Default to Master’s Content”,

Select “Yes” on the confirmation window,

“NewForm2.aspx” will look like this after following above steps,

With “PlaceHolderMain (Custom)” selected, Select “Insert” menu on the top and select “SharePoint Controls > Custom List Form…” as shown below,

Select “Calendar” in list and “Event” in content type. Also, select “New item form (used to add new items to the list)” in type of form to create,

“NewForm2.aspx” form will look like this after following above steps,

Now, we want to select all unwanted columns from this page – “NewForm2.aspx”. Select rows for Description, All Day Event, Recurrence and Workspace fields; Right click it and select Delete > Delete Rows to delete all these rows,

Here is how “NewForm2.aspx” looks like after customizing it as per above requirements,

Finally we want to set this page – “NewForm2.aspx” as default form when somebody adds a new event item to the Calendar. In order to do that, Right click on “Calendar” and select “Properties”,

Select “Supporting Files” tab and change new item form to “NewForm2.aspx” page with the help of “Browse” button,

Save all your changes and you are done!

Go to the Calendar of a SharePoint site and click “New” button to add a new event. You will have “NewForm2.aspx” page opened for adding new items,

Similarly you can customize pages/forms used for editing or displaying list items.

No comments: