Working with Office365 Project Online Tasks using JSOM - Part II

In this article, let us look at updating or deleting tasks on Office 365 project online using JavaScript Object Model.

This article series focuses on working with office 365 project online plan schedule tasks using JSOM approach. The previous article explains creating or retrieving tasks on project online schedules using JSOM approach.

• Working with Office365 Project Online Tasks using JSOM - Part I  

Update Task on Project Schedule 

To update a task on the project online, the following operations are performed.

• Check-out a project – This operation involves get project by GUID and check-out. (If already checked out, this step is not required) 
• Update task (OOB/custom fields can be updated) - This operation involves steps like get project by GUID, then get the project draft, get the task collection from the project draft, get task using task GUID, set necessary fields (OOB or custom) with values and updating project draft. 
• Publish & check-in the project. - This operation involves get project by GUID, get the project draft, publish/check-in the project. (If other actions are involved, this step is not required)

Working with Office365 Project Online Tasks using JSOM - Part I

This article series focuses on working with office 365 project online plan schedule tasks using JSOM approach. The operations like create, retrieve, update or delete project task operations are explained.

Here in this article, let us look at creating or retrieving project schedule tasks using JSOM approach. 

Office 365 Microsoft Project Online helps creating project plans, managing schedules and collaborating with other resources virtually. Project plans, task schedules and other objects on the Microsoft Project online can be accessed or created or updated programmatically. Microsoft documentation site  provides REST endpoints for working with project online objects. 

Load prerequisite files and context: 

To get the project server context working, first let us see the prerequisite files to be loaded for getting the project online contexts. The following piece of code shows how the required Project Server/SharePoint files and contexts (PS/SP) are loaded. 

Create, Retrieve, Update Or Delete Sub Sites On SharePoint Using JavaScript Object Model

In this post, you will learn how to retrieve, create, update or delete the sites under a site collection, using JavaScript Object Model (JSOM) on SharePoint 2013 / SharePoint Online sites like O365. The sites are considered as the sub sites within the site collection.

Before executing any operation, load the required scripts like SP.js, SP.RunTime.js. If the scripts are not initialized, use the snippet, given below:

1. var scriptbaseURL = _spPageContextInfo.webServerRelativeUrl + "_layouts/15/";    
2. $.getScript(scriptbaseURL + "SP.Runtime.js",    
3.     function ()  
4.    {    
5.         $.getScript(scriptbaseURL + "SP.js", RequiredFunctions);    
6.     }    
7. );   

Create Sub Site:

The operation will create a sub site within the site collection. 

• Access the context of the site and the Web object, using root site URL or the current context.
• Create WebCreationInformation Object. Set the necessary parameters like title, description, URL, Web template, site permission and the language.
• Add it to the existing Web collections and update the current site. Execute the request.

The code snippet, given below, helps in creating a site.

1. var rootSiteUrl = "https://abc.sharepoint.com";  
2. var ctx = new SP.ClientContext(rootSiteUrl);  
3. var web = ctx.get_web();  
4. var webInfo = new SP.WebCreationInformation();  
5. webInfo.set_title('subsite');  
6. webInfo.set_description('subsite description');  
7. webInfo.set_url('subsite');  
8. webInfo.set_webTemplate('STS#0');  
9. webInfo.set_useSamePermissionsAsParentSite(true);  
10. webInfo.set_language(1033);  
11.   
12. web.get_webs().add(webInfo);  
13. web.update();  
14. ctx.executeQueryAsync(function(){  
15.     console.log("Sub Site Created");  
16. },  
17. function(sender, args){  
18.     console.log("Failed to create sub site : " + args.get_message());  
19. }  
20. );   

Retrieve Sub Site:

The site properties can be retrieved, using JSOM. 

• Access the context and the Web object, using sub site URL.
• The basic properties can be retrieved from the above Web object.
• Other properties and information can be retrieved by accessing the necessary properties and methods. For example, just loading the Web object will not be able to retrieve more information on the features. To get the active features on the site, we need to access the feature on the select and load the object to retrieve the features information. Similarly, other collection values needs to be retrieved by explicitly accessing the methods. 

The code snippet, given below, helps to retrieve the site properties.

1. var subSiteUrl = "https://abc.sharepoint.com/subsite";  
2. var ctx = new SP.ClientContext(subSiteUrl);  
3. var web = ctx.get_web();  
4. var features = web.get_features();  
5. // Similarly other properties and information can be retrieved from the site  
6. ctx.load(web);  
7. ctx.load(features);  
8. ctx.executeQueryAsync(function(){  
9.     console.log("Title : " + web.get_title());  
10.     console.log("Description : " + web.get_description());  
11.     console.log("Totally " + features.get_count() + " Features active on the site")  
12.     // Similarly other feature properties can be retrieved.  
13. },  
14. function(sender, args){  
15.     console.log("Failed to retrieve sub site info : " + args.get_message());  
16. }  
17. );   

Update Sub Site:

The update operation will be very similar to create an operation. 

• Access the context of the site and the Web object, using sub site URL.
• Update the necessary properties, using the set methods.
• Update and execute the request. 

The code snippet, given below, helps in updating the site properties. Here, title and the description of the sub site are updated.

1. var subSiteUrl = "https://abc.sharepoint.com/subsite";  
2. var ctx = new SP.ClientContext(subSiteUrl);  
3. var web = ctx.get_web();      
4. web.set_title('new subsite');   
5. web.set_description('subsite description updated');  
6. web.update();  
7. ctx.executeQueryAsync(function(){  
8.     console.log("Sub site properties updated");  
9.     console.log("Title : " + web.get_title());  
10.     console.log("Description : " + web.get_description());  
11.  },  
12.  function(sender, args){  
13.     console.log("Failed to create sub site : " + args.get_message());  
14.  }  
15. );   

Delete Sub Site:

The delete operation will be very similar to create or update operations. Here, no input data is required. 

• Access the context of the site and the Web object, using sub site URL.
• Using the Web object, delete the site with delete object method.
• Execute the request, using the client context. 

The code snippet, given below, helps to delete the site.

1. var subSiteUrl = "https://abc.sharepoint.com/subsite";  
2. var ctx = new SP.ClientContext(subSiteUrl);  
3. var web = ctx.get_web();      
4. web.deleteObject();  
5. ctx.executeQueryAsync(function(){  
6.     console.log("Sub site deleted");          
7. },  
8. function(sender, args){  
9.     console.log("Failed to create sub site : " + args.get_message());  
10. }  
11. );  

Note: In these cases, you can check the result values in a Browser debugger console. You can change the logic to display the results on the pages. Place these scripts on the page, using the Web parts (Content Editor / Script Editor / any custom Web part) at the site collection level.  

Map Term Set To Metadata Site Column On SharePoint Using JavaScript Object Model

In this post, you will learn how to map a SharePoint taxonomy term set to a metadata site column using JavaScript Object model on SharePoint 2013 / SharePoint 2016 / SharePoint online sites like O365.

The basic idea of the article is to show how we can automate the mapping process of the term set to the site columns.

Load the required script files with the following snippet:

1. var scriptbaseURL = _spPageContextInfo.webServerRelativeUrl + "_layouts/15/";  
2. $.getScript(scriptbaseURL + "SP.Runtime.js",  
3.     function ()
4.    {  
5.         $.getScript(scriptbaseURL + "SP.js", function()
6.         {    
7.             $.getScript(scriptbaseURL + "SP.Taxonomy.js", GetTermSet);    
8.         });  
9.     }  
10. ); 

Here, we will see how we can retrieve the term sets from the metadata termstore and assign it to the metadata site column.

Get Term Set:

Let us first see how we can retrieve the term set from the taxonomy term store, using the term store name and the term set name. 

• Get the current context of the site. Using taxonomy and taxonomy session objects, get the taxonomy session of the current site context.
  
  1. var ctx = SP.ClientContext.get_current();  
  2. Session = SP.Taxonomy.TaxonomySession.getTaxonomySession(ctx);  
• From the taxonomy session, get the term stores. From the term store collection, retrieve the exact term store by using the term store name. In our case, the term store name is "Managed Metadata Service".
  1. var termStores = taxSession.get_termStores();  
  2. termStore = termStores.getByName("Managed Metadata Service");  
• From the term store; retrieve the groups. From the groups collection; retrieve the exact group by passing the group name. In our case, the group name is "Testing".  
  
  1. var groups = termStore.get_groups()  
  2. var group = groups.getByName("Testing")  
• From the group, retrieve all the term sets. From the term set collection, get the respective term set by passing the term set name. The term set name in our case is "Test".
  
  1. var termSets = group.get_termSets()  
  2. termSet = termSets.getByName("Test")  
• Load the term store, the term set objects and execute with the context to retrieve the required values. Here, we require the term store ID and term set ID. These properties are used to assign to the metadata site column properties.
  
  1. ctx.load(termStore);  
  2. ctx.load(termSet);  
  3. ctx.executeQueryAsync(function(){  
  4.         termStoreId = termStore.get_id();  
  5.         termSetId = termSet.get_id();  
  6.         MapTermSet();  
  7.     },function(sender,args){  
  8.   
  9.          console.log(args.get_message());  
  10.   
  11. });  

Here, the names are used for the term store and the term set instead of IDs, because the term store ID and term set id will change from Server to Server and the names will be the same. The names are common, because the users add it to the taxonomy store. 

Mapping Term Set to Site Column:

Now, we will see how we can map the above term set to the site column.

• Get the current context of the site, retrieve the Web object and from the object, get the fields collection.
  
  1. var ctx = SP.ClientContext.get_current();  
  2. var web = ctx.get_web();  
  3. var fields = web.get_fields();  
• Using field collections, retrieve the exact column by name with getByName method. In this case, column name is "TestColumn".
  
  1. field = fields.getByInternalNameOrTitle("TestColumn");  
• Cast the field to the taxonomy field. In the taxonomy field, set the term set ID and the term store ID of the term set. (Use values from the section, given above).
  
  1. txField = ctx.castTo(field, SP.Taxonomy.TaxonomyField);  
  2. txField.set_sspId(termStoreId);  
  3. txField.set_termSetId(termSetId);  
• Update and execute the query with the context to finalize the changes.
  
  1. txField.update();  
  2. ctx.executeQueryAsync(function(){                        
  3. },function(sender,args){      
  4.       console.log(args.get_message());    
  5. });  

The above operation will just set the term set to metadata site column at the site level. The columns inherited at the list level will not be changed. To make the changes of the site columns at the list level, we need to use the updateAndPushChanges(true), instead of update() method.

Now, if you open the site column, you will see the term set called "Test" is mapped to the site column "TestColumn" in the term set settings section.

The code snippet given below shows the entire view for the operations, mentioned above.

1. var scriptbaseURL = siteurl + "/_layouts/15/";  
2. $.getScript(scriptbaseURL + "SP.Runtime.js",  
3.     function () {  
4.         $.getScript(scriptbaseURL + "SP.js", function(){  
5.             $.getScript(scriptbaseURL + "SP.Taxonomy.js", GetTermSet);  
6.         });  
7.     }  
8. );  
9. var termStore = "";  
10. var termStoreId = "";  
11. var termSet = "";  
12. var termSetId = "";  
13. function GetTermSet(){  
14.     var ctx = SP.ClientContext.get_current();  
15.     var taxSession = SP.Taxonomy.TaxonomySession.getTaxonomySession(ctx);  
16.     var termStores = taxSession.get_termStores();  
17.     termStore = termStores.getByName("Managed Metadata Service");  
18.     var groups = termStore.get_groups()  
19.     var group = groups.getByName("Testing")  
20.     var termSets = group.get_termSets()  
21.     termSet = termSets.getByName("Test")  
22.       
23.     ctx.load(termStore);  
24.     ctx.load(termSet);  
25.     ctx.executeQueryAsync(function(){  
26.             termStoreId = termStore.get_id();  
27.             termSetId = termSet.get_id();  
28.             MapTermSet();  
29.         },function(sender,args){  
30.           console.log(args.get_message());  
31.     });  
32. }  
33. var field = "";  
34. var txField = "";  
35. function MapTermSet(){  
36.     var ctx = SP.ClientContext.get_current();  
37.     var web = ctx.get_web();  
38.     var fields = web.get_fields();  
39.     field = fields.getByInternalNameOrTitle("TestColumn");  
40.     txField = ctx.castTo(field, SP.Taxonomy.TaxonomyField);  
41.     txField.set_sspId(termStoreId);  
42.     txField.set_termSetId(termSetId);  
43.     //txField.update();  
44.     txField.updateAndPushChanges(true);  
45.     ctx.executeQueryAsync(function(){                         
46.     },function(sender,args){      
47.           console.log(args.get_message());    
48.     });  
49. }  

Note: This is applicable for SharePoint 2013 or SharePoint 2016 or SharePoint online sites.