Update a List in SharePoint 2013 Using CSOM-JavaScript

Introduction

This article explains how to update the list properties in SharePoint 2013 using CSOM-JavaScript.

Prerequisites

1. Ensure you have access to the Office 365 online.
2. Ensure Napa tool is available in your site.

Use the following procedure:

1. Create an app for SharePoint using Office 365 Tools. If you have missed out on how to create an app in SharePoint 2013, then Click here.
2. Create a list and name it “MyCustomList”. Click here if you want to learn how to create a list.
3. Click on the Default.aspx page.
   
   
    
4. Add a button to update the list description.
5. Place the following code inside the “PlaceHolderMain” tag.
   
   //create a button for list updation
   
   <button id="btnUpdateList" onclick="updateList()">Update List</button><br/>
   
    
6. Click on the App.js file.
   
   
    
7. Globally declare the content, web, list and targetList objects as shown below.
   
   var context = SP.ClientContext.get_current();
   var web=context.get_web();
   var list=web.get_lists();
   var targetList;
    
8. Now write the function to update the list in the site.
   
   

   function updateList() {

   //updates list properties

        targetList = list.getByTitle("MyCustomList"); 

   targetList.set_description('My custom list updated thru code');//sets the description for the list.

   targetList.update();

   context.executeQueryAsync(updateListSuccess, updateListFail);

   }
   
   

9. In the code above snippet we are updating the list description.
10. “set_description()” is the method to update the list description using the list object.
11. Now execute the code by calling executeQueryAsync as in the following:
    
    

    function updateListSuccess() {

    alert('List property updated successfully');

    }

    function updateListFail(sender, args) {

     alert('List Property Request failed. ' + args.get_message() + '\n' + args.get_stackTrace());

    }

     
12. That’s it! Now let's start testing.

Testing

1. Now to run the app click on the "Play" button that is available towards the left-most corner.
   
   
    
2. The app is packaged, deployed, and installed on your Office 365 Site.
   
   
    
3. Now you will be able to see the following page.
   
   
    
4. Before clicking the “Update List” navigate to the list.
5. You will not be able to see the description
6. To see the list, go to the following URL
   
   Syntax: https://yoursite/Lists/ListName
   Example: https://mysite/Lists/MyCSOMList
   
   
    
7. Now click the “Update List” button and navigate to the list.
   
   
   
   
   
   Now you will be able to see the description that you have set in the code.

Summary

Thus in this article you saw how to update the list properties in SharePoint 2013 using CSOM-JavaScript.