SharePoint List CRUD Operation using Rest Utility

I have read lots of articles on C# Corner, as well as on other online websites about CRUD operations on Sharepoint List. In most articles, I have found some redundant code which can be reused and utilized in such a way that any new developer or learner can learn from the code.
So, based on that, I have started working on creating SPRest Utility which will do lots of work internally to increase development speed with much less coding. As I am still working and it is not fully optimized, there is still redundant code and methods which I have to delete.

SPRest.ts



You might be wondering how to use SPRest for CRUD Operation in SharePoint.
First of all, save the above code in a file and then, add the reference to it on the page wherever you want to use it.
If you want to use this SPRest utility in your SPFx web part or add it using TypeScript, then you can find compatible SpRest.ts at my repo.
Once you have added references, then create the instance of SPRest with one parameter which accepts Sharepoint rootUrl used internally or generating request URL for REST API.
  1. var spRest=new SPRest("https://brgrp.sharepoint.com")  
For demonstration purposes, I am using "PlaceHolderList" that is having the following columns.
  • Title -Single line of Text
  • UserId - Number
  • Completed -Single line of Text

Get All List Items from Sharepoint List

By default, SharePoint List returns the top 100 records if you have more than 100 records in the list.
  1. // Get All Item from List item  
  2. spRest.Utils.ListItem.GetAllItem({listName:"PlaceHolderList"}).then(function(r){  
  3. console.log(r);  
  4. // Response received. TODO bind record to table or somewhere else.  
  5. });  

Get List Item from SharePoint List by Id
  1. // Get List Item By Id  
  2. spRest.Utils.ListItem.GetItemById({listName:"PlaceHolderList",Id:201}).then(function(r){    
  3. console.log(r);    
  4. // Response received.   
  5. });   
Add New List Item to SharePoint List
  1. // Add ListItem to Sharepoint List  
  2. spRest.Utils.ListItem.Add({listName:"PlaceHolderList",data:{Title:"New Item Created For Demo",UserId:1,Completed:"true"}}).then(function(r){    
  3. console.log(r);    
  4. // Added New List item response received with newly created item  
  5. });   
Update New List Item By Id in SharePoint List
  1. // Update List item based on ID with new data in SharePoint List  
  2. spRest.Utils.ListItem.Update({listName:"PlaceHolderList",Id:201,data:{Title:"Updated List Item",UserId:1,Completed:"true"}}).then(function(r){    
  3. // List Item Updated and received response with status 204  
  4. console.log(r);  
  5. });   
Delete New List Item By Id in SharePoint List
  1. // Delete List item based on ID  
  2. spRest.Utils.ListItem.Delete({listName:"PlaceHolderList",Id:201}).then(function(r){    
  3. // List Item Deleted and received response with status 200  
  4. console.log(r);  
  5. });   
As per the above code example for CRUD functionality, it looks like a cleaner and easier way to perform the CRUD opeation on SharePoint List. It has a lot of redundant code.
  • Generate Request Url Based on Root Site and List Name and Id
  • Header accept and Content type
  • RequestDigest Headers
  • Combined Delete/Update/Add  Code with reusable functions to prepare payload data for the request
  • Adding and applying metadata for ListItem based on ListName
I removed and combined with reusable functions so it can be used for extending List and Document Library in future.
I hope you find this article and utilities helpful. Let me know your comments and any suggestion to extend SPRest util.
All implementation and source code for SPRest can be found on GitHub.

Conclusion

In this article, we have learned about an easy and cleaner way to do CRUD Operations with SharePoint List Items using SPRest.

Comments

Popular Posts