SharePoint (and Project Server) Shenanigans

I am a Project Server and SharePoint consultant but my main focus currently is around Project Server. I have been working with Project Server for nearly five years since 2007 for a Microsoft Gold Certified Partner in the UK, I have also been awared with the Microsoft Community Contributor Award 2011. I am also a certified Prince2 Practitioner. This article has been cross posted from pwmather.wordpress.com (original article)

As mentioned when I published the JavaScript code that displays project level information on the project site, here is the supporting blog post. The quick post that references the script is below:

http://bit.ly/1p1Se4p

The script can be downloaded from the Microsoft Script Gallery below:

http://bit.ly/1wWzbNv

Firstly, as with the other JavaScript files I have published you will need jQuery:

jquery-1.8.3.min.js – jQuery download

A later version of this library may work but this was the one I used / tested with.

Upload this library to your PWA site collection then update the script file with the correct location. I uploaded this file to the site assets library as you can see in the code below:

Like the Project Milestone JavaScript file I wrote, you will also notice the reference to the default SharePoint JS files and the two references to the Data tables CSS and JS files. I just referenced the hosted files but you could download these and host them yourself – if hosting the data table files yourself you will need more than just the two files reference here. For a production environment I would probably recommend downloading and hosting the jQuery data tables locally.

Once the script has been downloaded you will notice that I have used 6 default project level fields and 2 custom fields. The two custom fields are Programme and RAGPMStatus. These can be seen on the select below:

Programme and RAGPMStatus are custom to my test environment but I added these to show that default and custom project level fields can easily be added. To get the script to work you can either add these fields to your configuration – probably fine for a test environment, or modify the script to remove the custom fields or add your own. Here I will assume you want to add 2 of your own project level custom fields. Below are parts of the script that will need to be modified to accept your own 2 project level custom fields. For simplicity we will assume that the two new fields are Project Location and Project RAG. Project RAG is associated to a lookup table with the following 3 values: Green, Amber, Red.

Starting from the top of the script file here are all the places you will need to modify to get the two new fields in the code.

• In the table, update the two column headers, replace Programme with Project Location and replace RAG Status with Project RAG.
• Update the select query, replace Programme with ProjectLocation and replace RAGPMStatus with ProjectRAG.
• On the first if statement replace Programme with ProjectLocation and replace RAGPMStatus with ProjectRAG.
• In the data table processing section, replace Programme with ProjectLocation and replace RAGPMStatus with ProjectRAG for the aoColumns parameter
• In the data table processing section for the aoColumnDefs parameter update the fnCreatedCell if statement with the correct lookup table values for the Project RAG field. So in this example replace On schedule [Green] with Green and Slipping but can mitigate [Amber] with Amber. You might also want to change the cell and font colors.

Once updated, add the script to your PWA site collection, I uploaded this to the Style Library. Then add a content editor web part to the project site and reference the uploaded project information JS file. If you want this to be on all project sites then you would need to create a new project site template with the JS file added.

Once added to a project site the project information will be visible for that project: