Thursday, June 5, 2014

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

No comments:

Post a Comment