Post
Ask Question

Introduction to SharePoint Client Context: SP.ClientContext (SP.JS)

SharePoint provides the JavaScript API reference files that contains the information used to access the data and build the custom applications. From the number of files, SP.JS is the most important file in the JSOM that provides the types and members the same as the Microsoft.SharePoint namespace to work with top-level sites, sub-sites and their lists and libraries.

The SP.JS file has the ClientContext object used for representing the context of SharePoint Objects and operations.

Here I will list each property of SP.ClientContext with an example.

SP.ClientContext.applicationName

Represent the name of the runtime application, where the current client application is located.

The following example gets the name of the application that runs in the current location.

  1. var clientContext = null;  
  2.   
  3. function contextInfo()  
  4. {  
  5.    //Create an instance of the Current Context  
  6.    clientContext = SP.ClientContext.get_current();  
  7.    appname = clientContext.get_applicationName();  
  8.    console.log("Application Name: "+ appname );  
  9. }  
  10. //Make sure the SharePoint script file 'sp.js' is loaded before the function 'contextInfo' runs  
  11. SP.SOD.executeFunc('sp.js', 'SP.ClientContext', contextInfo);  
Output

Returns the default value
Application Name: JavaScript Library

The following example sets the name for the runtime application, where the current client application is located. The parameter represents the name of the runtime application.

The string length for the application name should be between 1 and 265 characters.
  1. var clientContext = null;  
  2.   
  3. function contextInfo()  
  4. {  
  5.    //Create an instance of the Current Context  
  6.    clientContext = SP.ClientContext.get_current();  
  7.    clientContext.set_applicationName(“My Application”);  
  8.    appname = clientContext.get_applicationName();  
  9.    console.log("Application Name: "+ appname );  
  10. }  
  11. //Make sure the SharePoint script file 'sp.js' is loaded before the function 'contextInfo' runs  
  12. SP.SOD.executeFunc('sp.js', 'SP.ClientContext', contextInfo);  
Output

Application Name: My Application

SP.ClientContext.current
  1. Returns the current client context of the Client-Side Object Model (CSOM) runtime  
  2. var clientContext = null;  
  3.   
  4. function contextInfo()  
  5. {  
  6.    //Create an instance of the Current Context  
  7.    clientContext = SP.ClientContext.get_current();   
  8. }  
  9. SP.SOD.executeFunc('sp.js', 'SP.ClientContext', contextInfo);  
SP.ClientContext.formDigestHandlingEnabled

Gets or sets a Boolean value that indicates whether form digest handling is enabled. The following example retrieves the value for the current client context form digest settings is enabled or not.
  1. var clientContext = null;  
  2.   
  3. function contextInfo()  
  4. {  
  5. //Create an instance of the Current Context  
  6. clientContext = SP.ClientContext.get_current();  
  7. console.log("Form Digest Handling Enabled: " + clientContext.get_formDigestHandlingEnabled());  
  8.   
  9. }  
  10. //Make sure the SharePoint script file 'sp.js' is loaded before the function 'contextInfo' runs  
  11. SP.SOD.executeFunc('sp.js', 'SP.ClientContext', contextInfo);   
The following example enables the Form Digest Handling to the current client context.
  1. var clientContext = null;  
  2.   
  3. function contextInfo()  
  4. {  
  5.    //Create an instance of the Current Context  
  6.    clientContext = SP.ClientContext.get_current();  
  7. 　 clientContext.set_formDigestHandlingEnabled(true);  
  8.    console.log("Form Digest Handling Enabled: " + clientContext.get_formDigestHandlingEnabled());  
  9.   
  10. }  
  11. //Make sure the SharePoint script file 'sp.js' is loaded before the function 'contextInfo' runs  
  12. SP.SOD.executeFunc('sp.js', 'SP.ClientContext', contextInfo);   
Output

Form Digest Handling Enabled: true

SP.ClientContext.hasPendingRequest

Returns a Boolean value indicates whether the client runtime context has any pending request. The following example identifies the pending request.
  1. var clientContext = null;  
  2. var oWeb = null;  
  3.   
  4. function contextInfo()  
  5. {  
  6.    //Create an instance of the Current Context  
  7.    clientContext = SP.ClientContext.get_current();  
  8.   
  9.    oWeb = clientContext.get_web();  
  10.    clientContext.load(oWeb);  
  11.    //Below code returns true, because the code awaiting to send the request  
  12.    console.log("Has Pending Request (Before Execution): "+ clientContext.get_hasPendingRequest());   
  13.    clientContext.executeQueryAsync(onSucceeded, onFailed);  
  14.    //Below code returns false  
  15.    console.log("Has Pending Request (After Execution): "+ clientContext.get_hasPendingRequest());  
  16. }  
  17. //Make sure the SharePoint script file 'sp.js' is loaded before the function 'contextInfo' runs  
  18. SP.SOD.executeFunc('sp.js', 'SP.ClientContext', contextInfo);  
Output

Has Pending Request (Before Execution): true
Has Pending Request (After Execution): false

SP.ClientContext.requestTimeout

Gets or sets the timeout value for the current client context runtime. The following example code returns the default timeout value. 
  1. var clientContext = null;  
  2. function contextInfo()  
  3. {  
  4.    //Create an instance of the Current Context  
  5.    clientContext = SP.ClientContext.get_current();  
  6. 　　　　//Returns the default timeout value 180000 milliseconds  
  7.    console.log("Request Timeout Value: "+ clientContext.get_requestTimeout());   
  8. }  
  9. //Make sure the SharePoint script file 'sp.js' is loaded before the function 'contextInfo' runs  
  10. SP.SOD.executeFunc('sp.js', 'SP.ClientContext', contextInfo);  
Output

Request Timeout Value: 180000

The following example code sets the timeout value to “20000” milliseconds for the current client context runtime. The parameter value should be greater than or equal to 0. 0 represents the no timeout for the current application.
  1. var clientContext = null;  
  2. function contextInfo()  
  3. {  
  4.    //Create an instance of the Current Context  
  5.    clientContext = SP.ClientContext.get_current();  
  6.    clientContext.set_requestTimeout(20000);  
  7.    //Returns the default timeout value 20000 milliseconds  
  8.    console.log("Request Timeout Value: "+ clientContext.get_requestTimeout());   
  9. }  
  10. //Make sure the SharePoint script file 'sp.js' is loaded before the function 'contextInfo' runs  
  11. SP.SOD.executeFunc('sp.js', 'SP.ClientContext', contextInfo);  
Output

Request Timeout Value: 20000

SP.ClientContext. get_serverLibraryVersion

Returns the build version of Microsoft.SharePoint.Client.ServerRuntime.dll on the server.
  1. var clientContext = null;  
  2. function contextInfo()  
  3. {  
  4. //Create an instance of the Current Context  
  5. clientContext = SP.ClientContext.get_current();   
  6. clientContext.executeQueryAsync(onSucceeded, onFailed);  
  7. }  
  8. //Make sure the SharePoint script file 'sp.js' is loaded before the function 'contextInfo' runs  
  9. SP.SOD.executeFunc('sp.js', 'SP.ClientContext', contextInfo);  
  10.   
  11. function onSucceeded() {   
  12. //Returns the version of Microsoft.SharePoint.Client.ServerRuntime.dll installed on the server  
  13. console.log("Server Library Version: "+ clientContext.get_serverLibraryVersion());  
  14. }  
Output

Server Library Version: 15.0.4569.1501

SP.ClientContext.serverSchemaVersion

Returns the installed schema version of Microsoft.SharePoint.Client.ServerRuntime.dll on the server. The following example returns the schema version of the client context DLL from the current server.
  1. var clientContext = null;  
  2. function contextInfo()  
  3. {  
  4.    //Create an instance of the Current Context  
  5.    clientContext = SP.ClientContext.get_current();   
  6.    clientContext.executeQueryAsync(onSucceeded, onFailed);  
  7. }  
  8. //Make sure the SharePoint script file 'sp.js' is loaded before the function 'contextInfo' runs  
  9. SP.SOD.executeFunc('sp.js', 'SP.ClientContext', contextInfo);  
  10.   
  11. function onSucceeded() {   
  12.    //Returns the schema version of Microsoft.SharePoint.Client.ServerRuntime.dll installed on the server  
  13.    console.log("Server Schema Version: "+ clientContext.get_serverSchemaVersion());  
  14. }  
Output

Server Schema Version: 15.0.0.0

SP.ClientContext.serverVersion

Returns the current SharePoint version. The following example returns the SharePoint version of the current client context.
  1. var clientContext = null;  
  2. function contextInfo()  
  3. {  
  4.    //Create an instance of the Current Context  
  5.    clientContext = SP.ClientContext.get_current();   
  6.    clientContext.executeQueryAsync(onSucceeded, onFailed);  
  7. }  
  8. //Make sure the SharePoint script file 'sp.js' is loaded before the function 'contextInfo' runs  
  9. SP.SOD.executeFunc('sp.js', 'SP.ClientContext', contextInfo);  
  10.   
  11. function onSucceeded() {   
  12.    //Returns the version of SharePoint  
  13.    console.log("SharePoint Server Version:"+ clientContext.get_serverVersion());  
  14. }  
Output

SharePoint Server Version: 15.0.4569.1501

SP.ClientContext.traceCorrelationId

Gets or sets the trace correlation id of the current context application. The following example gets the correlation id from the current runtime application.
  1. var clientContext = null;  
  2. function contextInfo()  
  3. {  
  4.    //Create an instance of the Current Context  
  5.    clientContext = SP.ClientContext.get_current();   
  6.    //Returns the null, because the request is not executed. It returns the value on the execution of request.  
  7.    console.log("Trace Correlation ID (Before Execution): "+ clientContext.get_traceCorrelationId());  
  8.    clientContext.executeQueryAsync(onSucceeded, onFailed);  
  9. }  
  10. //Make sure the SharePoint script file 'sp.js' is loaded before the function 'contextInfo' runs  
  11. SP.SOD.executeFunc('sp.js', 'SP.ClientContext', contextInfo);  
  12.   
  13. function onSucceeded() {   
  14.    //Returns the value of correlation id  
  15.    console.log("Trace Correlation ID (After Execution): "+ clientContext.get_traceCorrelationId());  
  16. }  
output

Trace Correlation ID (Before Execution): null
Trace Correlation ID (After Execution): 7ad5fe9c-9163-f08f-4af5-87b3ede4b5de

The following example sets the co-relation id to the current context runtime application.
  1. var clientContext = null;  
  2. function contextInfo()  
  3. {  
  4.    //Create an instance of the Current Context  
  5.    clientContext = SP.ClientContext.get_current();   
  6.    //Sets the value in the guid format to the correlation id  
  7.    clientContext.set_traceCorrelationId('a0d5fe9c-e1db-f08f-4af5-817583770b01');  
  8.    clientContext.executeQueryAsync(onSucceeded, onFailed);  
  9. }  
  10. //Make sure the SharePoint script file 'sp.js' is loaded before the function 'contextInfo' runs  
  11. SP.SOD.executeFunc('sp.js', 'SP.ClientContext', contextInfo);  
  12.   
  13. function onSucceeded() {   
  14.    //Returns the correlation id, which we set before execution  
  15.    console.log("Trace Correlation ID (After Execution): "+ clientContext.get_traceCorrelationId());  
  16. }  
Output

Trace Correlation ID (After Execution): a0d5fe9c-e1db-f08f-4af5-817583770b01

SP.ClientContext.url

Returns the URL associated with the runtime context. The following example returns the server relative URL of the current web site. 
  1. var clientContext = null;  
  2. function contextInfo()  
  3. {  
  4.    //Create an instance of the Current Context  
  5.    clientContext = SP.ClientContext.get_current();   
  6.    //Logs the current website server relative url  
  7.    console.log(“Url: “ + clientContext.get_url());  
  8. }  
  9. //Make sure the SharePoint script file 'sp.js' is loaded before the function 'contextInfo' runs  
  10. SP.SOD.executeFunc('sp.js', 'SP.ClientContext', contextInfo);  
Output
Url: /

SP.ClientContext.site

Returns the site collection object associated with the current client context. The following example returns the site collection URL and id based on the current client context.
  1. var clientContext = null;  
  2. var oSite;  
  3. function contextInfo()  
  4. {  
  5.    //Create an instance of the Current Context  
  6.    clientContext = SP.ClientContext.get_current();   
  7.    oSite = clientContext.get_site();  
  8.    clientContext.load(oSite);   
  9.    clientContext.executeQueryAsync(onSucceeded, onFailed);  
  10. }  
  11. //Make sure the SharePoint script file 'sp.js' is loaded before the function 'contextInfo' runs  
  12. SP.SOD.executeFunc('sp.js', 'SP.ClientContext', contextInfo);  
  13.   
  14. function onSucceeded() {   
  15.    console.log("Site Collection URL: "+ oSite.get_url());  
  16.    console.log("Site Collection ID: "+ oSite.get_id());  
  17. }  
  18.   
  19. function onFailed(sender, args) {  
  20.    console.log("Request Failed: "+ args.get_message());  
  21. }  
Output

Site Collection URL: https://sharepointsite
Site Collection ID: f99d7e6e-081a-4c58-806f-ef3f979e5724

SP.ClientContext.web

Returns the web site object associated with the current client context. The following example returns the title and URL of the website based on the current client context.
  1. var clientContext = null;  
  2. var oWeb;  
  3. function contextInfo()  
  4. {  
  5.    //Create an instance of the Current Context  
  6.    clientContext = SP.ClientContext.get_current();   
  7.    oWeb = clientContext.get_web();  
  8.    clientContext.load(oWeb);   
  9.    clientContext.executeQueryAsync(onSucceeded, onFailed);  
  10. }  
  11. //Make sure the SharePoint script file 'sp.js' is loaded before the function 'contextInfo' runs  
  12. SP.SOD.executeFunc('sp.js', 'SP.ClientContext', contextInfo);  
  13.   
  14. function onSucceeded() {   
  15.    console.log("Web Site Title: "+ oWeb.get_title());  
  16.    console.log("Web Site URL: "+ oWeb.get_url());  
  17. }  
  18.   
  19. function onFailed(sender, args) {  
  20.    console.log("Request Failed: "+ args.get_message());  
  21. }  
Output

Web Site Title: SharePoint Demo Site
Web Site URL: https://sharepointsite

Summary

This article explores the properties of the current Client Context object and this is very helpful for developing an application using the JavaScript Side Object Model.


Similar Articles