What is SharePoint ?
Microsoft SharePoint is a popular business platform that supports a wide variety of projects, from simple document management solutions to networking portals and Internet sites.
MS SharePoint includes several products, including SharePoint Foundation, SharePoint Online for Web functionality, SharePoint Server, SharePoint Designer and SharePoint Workspace; the additional SharePoint modules offer their own features for site or network design.
MS SharePoint has traditionally been used as a document management tool or content management system (CMS), or to set up a business intranet. Now, as more advanced technologies offer additional benefits to companies, many of these, like specific enterprise resource planning tools and customer relationship management (CRM) interfaces, are SharePoint compatible, so that they can be added to a legacy SharePoint system.
What is REST API?
A RESTful API is an application program interface (API) that uses HTTP requests to GET, PUT, POST and DELETE data.
A RESTful API — also referred to as a RESTful web service — is based on representational state transfer (REST) technology, an architectural style and approach to communications often used in web services development.
Working of RestAPI with Sharepoint :
To use the REST capabilities that are built into SharePoint, you construct a RESTful HTTP request by using the OData standard, which corresponds to the client object model API you want to use. The client.svc web service handles the HTTP request and serves the appropriate response in JSON format. The client application must then parse that response.
The endpoints in the SharePoint REST service correspond to the types and members in the SharePoint client object models. By using HTTP requests, you can use these REST endpoints to perform typical CRUD operations against SharePoint entities, such as lists and sites.
Architecture of Sharepoint Rest Service :
HTTP commands with Sharepoint Rest Service :
To perform various CRUD operations we use the following HTTP commands :
- GET : To read a resource
- POST : Create or update a resource
- PUT : Insert or update a resource
- DELETE : Delete a resource
CRUD Operations :
To begin with, we will first create a sample list in SharePoint. In my example, I have created “RestAPI_SPListDemo” on which various operations will be performed.
In the next step we will create a document library where our html file will be stored. In my example, I have stored the html code in an file “demoCode”.
In the next step we will create a page in the sharepoint site (PracticeDetailsDemo) and insert a Content Editor Web Part (CEWP) into the page. After inserting, edit the properties of the CEWP by providing the “Content Link” as the link to the text file, having html code.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 |
<!doctype html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> <title> Sharepoint CRUD operations with RESTful API </title> <style> table,th,td { border: 1px solid black; } </style> </head> <script> $(document).ready(function() { var listName = "RestAPI_SPListDemo"; ReadListItem(listName); }); function ReadListItem(listName) { var row = ""; $.ajax({ url: _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/getbytitle('" + listName + "')/items?$select=Practice_x0020_ID,Title,Practice_x0020_Code,Practice_x0020_Manager", method: "GET", headers: { "Accept": "application/json;odata=verbose", "Content-Type": "application/json;odata=verbose", "X-RequestDigest": $("#__REQUESTDIGEST").val(), "IF-MATCH": "*", "X-HTTP-Method": null }, dataType:"json", success: function (msg) { $.each(msg.d.results, function (index, obj) { row += "<tr><td>" + obj.Practice_x0020_ID + "</td><td>" + obj.Title + "</td><td>" + obj.Practice_x0020_Code + "</td><td>" + obj.Practice_x0020_Manager + "</td></tr>"; }); $("#tableForRead").append(row); }, error: function (data) { alert("No Item found"); } }); } function InsertDataIntoSPList() { var listName = "RestAPI_SPListDemo"; var practiceID = $("#txtPracticeID").val(); var practiceName = $("#txtPracticeName").val(); var practiceCode = $("#txt $.ajax({ url: _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/getbytitle('" + listName + "')/items", method: "POST", contentType: "application/json;odata=verbose", data: JSON.stringify(item), headers: { "Accept": "application/json;odata=verbose", "X-RequestDigest": $("#__REQUESTDIGEST").val() }, success: function (data) { alert("success"); }, error: function (xhr,status,error) { alert(xhr.responseText); } }); } function UpdateListItem() { var myID = $("#itemID").val(); var listName = "RestAPI_SPListDemo"; var practiceID = $("#practiceID").val(); var practiceName = $("#practiceName").val(); var practiceCode = $("#practiceCode").val(); var practiceManager = $("#practiceManager").val(); var item = { "__metadata": { "type": "SP.Data.RestAPI_x005f_SPListDemoListItem" }, "Title": practiceName, "Practice_x0020_ID": practiceID, "Practice_x0020_Code": practiceCode, "Practice_x0020_Manager": practiceManager }; $.ajax({ url: _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/getbytitle('" + listName + "')/items(" + myID + ")", type: "POST", contentType: "application/json;odata=verbose", data: JSON.stringify(item), headers: { "Accept": "application/json;odata=verbose", "X-RequestDigest": $("#__REQUESTDIGEST").val(), "IF-MATCH": "*", "X-HTTP-Method":"MERGE", }, success: function (data) { alert("success"); }, error: function (data) { alert("failed"); } }); } function RemoveListItem() { var myID = $("#itmID").val(); var listName = "RestAPI_SPListDemo"; $.ajax({ url: _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/getbytitle('" + listName + "')/items(" + myID + ")", type: "POST", contentType: "application/json;odata=verbose", headers: { "Accept": "application/json;odata=verbose", "X-RequestDigest": $("#__REQUESTDIGEST").val(), "IF-MATCH": "*", "X-HTTP-Method":"DELETE", }, success: function (data) { alert("success"); }, error: function (data) { alert("failed"); } }); } </script> <body> <div id="restBody"> <h2>CRUD operations on Sharepoint list using REST API</h2> <!-- --------------- code to read data of a sharepoint list ------------- --> <p> 1. READ data from SPList using REST API</p> <table id="tableForRead"> <tr> <th>Practice ID</th> <th>Practice Name</th> <th>Practice Code</th> <th>Pratice Manager</th> </tr> </table> <!-- --------------- code to insert a list item ------------- --> <p> 2. Insert data into SPList using RESTful API</p> <table id="myTable"> <tr> <td>Practice ID</td> <td><input type="text" id="txtPracticeID" style="width: 200px"></td> </tr> <tr> <td>Practice Name</td> <td><input type="text" id="txtPracticeName" style="width: 200px"></td> </tr> <tr> <td>Practice Code</td> <td><input type="text" id="txtPracticeCode" style="width: 200px"></td> </tr> <tr> <td>Practice Manager</td> <td><input type="text" id="txtPracticeManager" style="width: 200px"></td> </tr> </table> <button class="myButton" onclick="InsertDataIntoSPList()">INSERT</button> <!-- --------------- code to update a list item ------------- --> <p> 3. Update list items in SPList using RESTful API</p> <p>Enter Item ID to update the list item</p> <input placeholder="Item ID" type="text" id="itemID"> <table> <tr> <td>Practice ID</td> <td><input type="text" id="practiceID" style="width: 200px"></td> </tr> <tr> <td>Practice Name</td> <td><input type="text" id="practiceName" style="width: 200px"></td> </tr> <tr> <td>Practice Code</td> <td><input type="text" id="practiceCode" style="width: 200px"></td> </tr> <tr> <td>Practice Manager</td> <td><input type="text" id="practiceManager" style="width: 200px"></td> </tr> </table> <button onclick="UpdateListItem()">UPDATE</button> <!-- --------------- code to delete a list item ------------- --> <p> 4. Delete list items using RESTful API</p> <p>Enter Item ID to delete the list item</p> <input placeholder="Item ID" type="text" id="itmID"> <button class="myButton" onclick="RemoveListItem()">DELETE</button> </div> </body> </html> |
The output of this html file will be rendered by the Content Editor Web Part and will be displayed on the page.
The first table shows the data that is in the SharePoint list “RestAPI_SPListDemo” and the other sections can be used to perform necessary operations such as insertion, deletion etc.
INSERT OPERATION :
UPDATE OPERATION :
DELETE OPERATION :