Add, Update and Delete SPListItem in SPList using JavaScript Object Model

Introduction

One person commented that - he needs to know How to Add, Update and Delete SPListItem in a SPList using JavaScript Object Model in a previous blog post. So I thought of writing a post for him; and which may useful for other new SharePoint newbies too.

Solution

Add

1. function Add() {
2.     var clientContext = new SP.ClientContext();
3.     var oWeb = clientContext.get_web();
4.     var oList = oWeb.get_lists().getByTitle('List1');//Get SPList by Title
5.     var itemCreateInfo = new SP.ListItemCreationInformation();
6.  
7.     var oListItem = oList.addItem(itemCreateInfo);
8.     oListItem.set_item('Title', 'Value'); //Title is the field and Value is the value for field
9.     oListItem.update();
10.  
11.     clientContext.load(oListItem);
12.     clientContext.executeQueryAsync(Function.createDelegate(this, onQuerySucceeded), Function.createDelegate(this, onQueryFailed));
13.  
14.     //Function when the execution of the query successed
15.     function onQuerySucceeded(sender, args) {
16.         alert('Data ADDED successfully');
17.     };
18.     //Function to run when the execution falis
19.     function onQueryFailed(sender, args) {
20.         alert('Cannot ADD');
21.     };
22.  
23. };

Update

1. function Update() {
2.     var clientContext = new SP.ClientContext();
3.     var oWeb = clientContext.get_web();
4.     var oList = oWeb.get_lists().getByTitle('List1');//Get SPList by Title
5.  
6.     var oListItem = oList.getItemById(1);//Get the list item by id
7.     oListItem.set_item('Title', 'New Value');
8.     oListItem.update();
9.     clientContext.executeQueryAsync(Function.createDelegate(this, onQuerySucceeded), Function.createDelegate(this, onQueryFailed));
10.  
11.     //Function when the execution of the query successed
12.     function onQuerySucceeded(sender, args) {
13.         alert('Data UPDATED successfully');
14.     };
15.     //Function to run when the execution falis
16.     function onQueryFailed(sender, args) {
17.         alert('Cannot UPDATE');
18.     };
19. };

Delete

1. function Delete() {
2.     var clientContext = new SP.ClientContext();
3.     var oWeb = clientContext.get_web();
4.     var oList = oWeb.get_lists().getByTitle('List1');//Get SPList by Title
5.  
6.     var oListItem = oList.getItemById(1);//Get the list item by id
7.    oListItem.deleteObject();
8.     clientContext.executeQueryAsync(Function.createDelegate(this, onQuerySucceeded), Function.createDelegate(this, onQueryFailed));
9.  
10.     //Function when the execution of the query successed
11.     function onQuerySucceeded(sender, args) {
12.         alert('Data DELETED successfully');
13.     };
14.     //Function to run when the execution falis
15.     function onQueryFailed(sender, args) {
16.         alert('Cannot DELETE');
17.     };
18. };

You can download the entire solution from the below url. https://drive.google.com/file/d/0ByEnOE8DAdvhSWFfM0Jja1FHMms/edit?usp=sharing