Home > Paul Mather, Work > Want to see Risks and Issues on a #ProjectOnline / #ProjectServer project detail page? #PS2013 #SharePointOnline #SP2013 #Office365 #JavaScript #jQuery

Want to see Risks and Issues on a #ProjectOnline / #ProjectServer project detail page? #PS2013 #SharePointOnline #SP2013 #Office365 #JavaScript #jQuery

Paul Mather
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)

Over the last few weeks when I have had a spare 5 minutes I have been playing with JavaScript /jQuery. It is something I have wanted to learn for a while and finally thought I would give it ago and see what I could do with SharePoint / Project data. After lots of reading and researching (lots of examples out there!) I came across some very useful jQuery libraries. This post covers the usage of a script I put together to display risks and issues on a project detail page from the associated project site. The full script can be downloaded from the Microsoft script gallery below:


The script only uses default Project Server Issues and Risks columns so it will work as is but it can easily be updated to include other columns.

To get the script to work you will need to download the following jQuery libraries:

jquery-1.8.3.min.js – jQuery download

knockout-3.1.0.js – knockout jQuery download

ko.sp-1.0.min.Ex.js – knockout JS binder library – Extended Version (Includes Moment Js and numeral Js)

Later versions of these libraries may work but these were the ones I used / tested with.

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


Also note the references to the default SharePoint / ProjectServer JavaScript libraries.

Once the script is uploaded, save this to the PWA site collection. I uploaded the JavaScript file to the style library:


Now create a new PDP page, I called mine Risks and Issues. Then add a content editor web part on the page and reference the riskandissueonPDP.js file. After clicking save you should see the following message above the grids:


This is because the current page is not an actual projects project details page. Add the new PDP to the correct EPT/s. Now navigate to the Project Center and click on a project that contains risks and / or issues on the associated project site. Click the new Risks and Issues PDP and you will see the the risks and issues displayed:


The script is just an example I put together and should really be improved for a production environment  – error handling, update the displayed columns, visualise processing etc. Watch this space for more JavaScript examples as I dabble further! Smile

Categories: Paul Mather, Work Tags:
  1. No comments yet.
  1. No trackbacks yet.

Leave a Reply

Please log in using one of these methods to post your comment:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this: