Create View in SharePoint using JSOM

The example in this topic show how to use JSOM to Create View in SharePoint

  • function CreateListView() {
  •     // You can optionally specify the Site URL here to get the context
  •     // If you don't specify the URL, the method will get the context of the current site
  •     // var clientContext = new SP.ClientContext("http://MyServer/sites/SiteCollection");
  •     var clientContext = new SP.ClientContext();
  •  
  •     // Get List Object
  •     var olistCollection = clientContext.get_web().get_lists();
  •     var oList = olistCollection.getByTitle("List Name");
  •  
  •     // New "ViewCreationInformation" object
  •     var creationInfo = new SP.ViewCreationInformation();
  •  
  •     // Code to update the display name for the view.
  •     creationInfo.set_title("Custom View");
  •  
  •     // If passed "true" this new view will be set as default view of the list
  •     creationInfo.set_setAsDefaultView("false");
  •  
  •     // You can optionally specify row limit for the view
  •     creationInfo.set_rowLimit("15");
  •  
  •     // Add all the fields over here with comma separated value as mentioned below
  •     // You can mention display name or internal name of the column   
  •     var viewFields = new Array('Title', 'Notes');
  •     creationInfo.set_viewFields(viewFields);
  •  
  •     // Specify type of the view. Below are the options
  •  
  •     // 1. none - The type of the list view is not specified
  •  
  •     // 2. html - Sspecifies an HTML list view type
  •  
  •     // 3. grid - Specifies a datasheet list view type
  •  
  •     // 4. calendar- Specifies a calendar list view type
  •  
  •     // 5. recurrence - Specifies a list view type that displays recurring events
  •  
  •     // 6. chart - Specifies a chart list view type
  •  
  •     // 7. gantt - Specifies a Gantt chart list view type
  •     var viewType = new SP.ViewType();
  •     creationInfo.set_viewTypeKind(viewType.chart);
  •  
  •     // You can optionally specify a query as mentioned below.
  •     // Create one CAML query to filter list view and mention that query below
  •     var camlQuery = new SP.CamlQuery();
  •     var query = "<Where><IsNotNull><FieldRef Name='Title'/></IsNotNull></Where>";
  •     camlQuery.set_viewXml(query);
  •     creationInfo.set_query(camlQuery);
  •  
  •     var oListViews = oList.get_views().add(creationInfo);
  •  
  •     //Load the client context and execute the batch
  •     clientContext.load(oListViews);
  •  
  •     // Execute the query to the server.
  •     clientContext.executeQueryAsync(onsuccess, onfailed);
  • }
  •  
  • function onsuccess() {
  •     console.log('Success');
  • }
  •  
  • function onfailed(sender, args) {
  •     console.log('Failed' + args.get_message() + '\n' + args.get_stackTrace());
  • }

Thank you for reading this article. This code was tested in SharePoint 2013

We value your feedback:

Page URL:

Name:

 

Email:

 
 

Feedback:

 

© 2019 Code SharePoint