Create Document Set In SharePoint Using JavaScript Object Model

Document sets can be used, when you want to group together documents within a particular library. Document set by itself is a content type, which acts as a folder at a high level. Apart from the logical grouping of the documents, we can also assign the metadata and assign Workflows to run on a group of documents. In addition to it, we can set the default content to a document set, so that whenever a document set is created, the default contents will be created along with it. This is quite helpful, as it gives a starting point to the team. Documents sets were introduced in SharePoint 2010 version and has made its way all the way till SharePoint 2016 came.

Document sets are part of a site collection feature.



We can create document sets out of the box, as well as through SharePoint programming model. In this article, we will see, how we can create a Document Set, using JavaScript Object Model.

Internal Implementation

• Add reference to jQuery file.
  
  1. <script language="javascript" type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>  
  2. <script language="javascript" type="text/javascript">  
• Within Document ready function, use getScript function, so as to load the on demand script SP.js and SP.DocumentManagement.js . Call the main starting point function say: createDocumentSet.
  
  1. $.getScript(scriptbase + "SP.DocumentManagement.js",createDocumentSet);  
• Instantiate client context, web and library instance.
  
  1. clientContext = new SP.ClientContext.get_current();  
  2. oWeb = clientContext.get_web();  
  3. var oList = oWeb.get_lists().getByTitle("Demo Library");  
• Get the content type for the Document Set.
  
  1. var documentSetContentTypeID = "0x0120D520";  
  2. documentSetContentType = clientContext.get_site().get_rootWeb().get_contentTypes().getById(documentSetContentTypeID);  
• Load the client context and execute the batch.
  
  1. clientContext.load(documentSetContentType);  
  2. clientContext.executeQueryAsync(QuerySuccess, QueryFailure);  
• In the success call back function, set the document set name and create the Document Set.
  
  1. var documentSetName = "Long Term Execution Planning";  
  2. SP.DocumentSet.DocumentSet.create(clientContext, oLibraryFolder, documentSetName, documentSetContentType.get_id());  
• Execute the batch once again.
  
  1. clientContext.executeQueryAsync(SecondQuerySuccess,SecondQueryFailure);  
  Full Code
  
  The full code to create a document set, using JSOM is given below-
  
  1. <script language="javascript" type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>  
  2. <script language="javascript" type="text/javascript">  
  3.     $(document).ready(function() {  
  4.         var scriptbase = _spPageContextInfo.webServerRelativeUrl + "/_layouts/15/";  
  5.         $.getScript(scriptbase + "SP.Runtime.js", function() {  
  6.             $.getScript(scriptbase + "SP.js", function() {  
  7.                 $.getScript(scriptbase + "SP.DocumentManagement.js", createDocumentSet);  
  8.             });  
  9.         });  
  10.     });  
  11.     var oLibraryFolder, clientContext, docSetContentType;  
  12.   
  13.     function createDocumentSet() {  
  14.         //Get the client context,web and library object.  
  15.         clientContext = new SP.ClientContext.get_current();  
  16.         oWeb = clientContext.get_web();  
  17.         var oList = oWeb.get_lists().getByTitle("Demo Library");  
  18.         //Load the library object  
  19.         clientContext.load(oList);  
  20.         //Get the root folder of the library and load it  
  21.         oLibraryFolder = oList.get_rootFolder();  
  22.         clientContext.load(oLibraryFolder);  
  23.         //Get the content type for the document set and load it  
  24.         var documentSetContentTypeID = "0x0120D520";  
  25.         documentSetContentType = clientContext.get_site().get_rootWeb().get_contentTypes().getById(documentSetContentTypeID);  
  26.         clientContext.load(documentSetContentType);  
  27.         //Execute the batch  
  28.         clientContext.executeQueryAsync(QuerySuccess, QueryFailure);  
  29.     }  
  30.   
  31.     function QuerySuccess() {  
  32.         //Set the document set name  
  33.         var documentSetName = "Long Term Execution Planning";  
  34.         SP.DocumentSet.DocumentSet.create(clientContext, oLibraryFolder, documentSetName, documentSetContentType.get_id());  
  35.         clientContext.executeQueryAsync(SecondQuerySuccess, SecondQueryFailure);  
  36.     }  
  37.   
  38.     function QueryFailure() {  
  39.         console.log('Request failed - ' + args.get_message());  
  40.     }  
  41.   
  42.     function SecondQuerySuccess() {  
  43.         console.log('Document Set Created.');  
  44.     }  
  45.   
  46.     function SecondQueryFailure(sender, args) {  
  47.         console.log('Request failed - ' + args.get_message());  
  48.     }  
  49. </script>  

• Go to the edit settings of SharePoint page and click Web part from the Insert tab.
  
  
  
  
• Add Content Editor Web part.
  
  
  
  
• Click Edit Web part from Content Edit Web part. Assign the URL of the script text file and click Apply.
  
  
  

Output: The document set has been created in the library.





Summary

Thus, we have seen, how to create the Document Set, using JavaScript Object Model. This has been tried and tested in both SharePoint 2016 and Office 365.