Retrieving the Project GUID with JavaScript CSOM #PS2013 #PS2010 #MSProject #Office365 #in
So the Microsoft Office preview is out and unfortunately my colleagues and I are still consulting on current and previous versions, so only limited time around client work allows for play. Luckily we have had access to earlier versions for several months now so as a company Corporate Project Solutions is prepared for 2013 and we are even running knowledge sessions and upgrade validation checks.
Moving on… whilst in the hotel, we started playing with Napa and the possibilities around what can and can’t be done.
Although this example is not relevant to Napa (due to the environment the apps run in), we did manage to product some code that would be useful for Sandbox Solutions or Composite solutions using the Content Editor Web Part in Project Online, Project Server 2013 and potentially Project Server 2010.
In this example, we use the SharePoint Client Side Object Model to view the property bag within a Project Site to retrieve the following:
- Internal Project UID
- Project Wep App URL
- Project Web App Site UID.
NB: The Project UID is for the plan associated within to the site in Project Server.
The Result
SharePoint CSOM code running within a Project Site in Project Online (Office 365 Preview)
Closer look at the output
So you may be wondering, why we need this information. Well with the introduction of Project Online / Project Server 2013, the client side object model can interact with the PSI to return Project and Resource data.
In many cases you will need the Project UID as a starting point!
Here are the details of getting things up and running in the IE Development Toolbar and trust me, there is much more CSOM goodness to come.
Final Code Example:
function getWebProperty() { var ctx = new SP.ClientContext.get_current(); this.web = ctx.get_web(); this.props = this.web.get_allProperties(); ctx.executeQueryAsync( Function.createDelegate(this, gotProperty), Function.createDelegate(this, failedGettingProperty) ); } function gotProperty() { alert("Project UID: " + this.props.get_fieldValues()["MSPWAPROJUID"] + "\nPWA URL: " + this.props.get_fieldValues()["PWAURL"] + "\nPWA Site UID: " + this.props.get_fieldValues()["MSPWASITEUID"] ); } function failedGettingProperty() { alert("failed"); } getWebProperty();
Debug Code Example:
To get this detail out, me and my colleague had to do some digging in the object model using debug code to alert out to the console values at the Web and Property object areas:
function getWebProperty() { var ctx = new SP.ClientContext.get_current(); for(var p in ctx) { console.log("T: " + p); } this.web = ctx.get_web(); this.props = this.web.get_allProperties(); ctx.load(this.web); ctx.load(this.props); ctx.executeQueryAsync( Function.createDelegate(this, gotProperty), Function.createDelegate(this, failedGettingProperty) ); } function gotProperty() { //alert(props.isPropertyAvailable('allowdesigner')); for(var itm in this.web){ console.log(itm); } for(var prop in props){ console.log(prop); } for(var fv in this.props.get_fieldValues()) { console.log(fv); } alert(this.props.get_fieldValues()["MSPWAPROJUID"]); } function failedGettingProperty() { alert("failed"); } getWebProperty();
Example References
Just in case you need to add sources for JavaScript frameworks. Here are some references below:
<script type="text/ecmascript" src="/_layouts/SP.Core.js" /> <script type="text/ecmascript" src="/_layouts/SP.Debug.js" /> <script type="text/ecmascript" src="/_layouts/SP.Runtime.Debug.js" /> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" />
Great Article! I had been looking for something that talked about properties.
I have copied your code exactly (Final Code Example) into a text file, and uploaded that text file to SharePoint, and linked that file to a content editor web part, and I am getting this error:
Unable to get value of the property ‘get_current’: object is null or undefined
ClientContext is returning null. Any ideas? I have added this content editor part to the Tasks Page of the Project Site
Hi,
Can you confirm that you have added the JavaScript references to sp.js etc…? This is required for CSOM to work.
In the meantime, I will take a look at my example code again.
Kind regards
Giles
Thanks for the reply,
No, there are no references to other JS files in my code. Are these the ones I need?
Can the path always be hard-coded as “/_layouts/SP.Core.js”?
Hi Paul,
Apologies for the delay in my reply, yes the relative path can be placed anywhere.
Adding the below references into a Content Editor Web Part before your code runs should solve your issues:
I hope that helps
Kind Regards
Giles