How to Get All List Items Of A List Using REST API In SharePoint Online And Office 365

Welcome to an article on “How to Get all list items of a list using REST API in SharePoint Online and Office 365,” where we will see the steps to create an App using the Napa Tool, which will help us to get all the items of a list in a view using REST API.

• Open the “NAPA” Office 365 development tools through your SharePoint store.
  
  
• Click Add New Project.
  
  
• It will ask you, what type of App do you want to build?
  
  
  
  
• Select SharePoint Add-in and provide a name to your app and click on Create.
  
  
  
  
• You will see the screenshot, shown below, on the app:
  
  
  
  
• Click Default.aspx and paste the code, given below:
  
  1. “<asp:ContentContentPlaceHolderIDasp:ContentContentPlaceHolderID="PlaceHolderMain" runat="server">”.
  Code
  
  1. <div>
  2. <p>
  3. <b>List Items</b>
  4. <br />
  5. <select style="height:400px; width:200px" multiple="multiple" id="selectalllistitems"></select>
  6. </p>
  7. </div>
• Now, on the navigation, click on the App.js file and paste the code, shown below, by removing the previous code completely.
  
  Code
  
  1. 'use strict';
  2. var hostweblink;
  3. var applink;
  4. // Get the links on load of the app
  5. $(document).ready(function()
  6. {
  7. hostweblink = decodeURIComponent(
  8. getQueryStringParameter("SPHostUrl"));
  9. applink = decodeURIComponent(
  10. getQueryStringParameter("SPAppWebUrl"));
  11. //Load the script base
  12. var scriptlink = hostweblink + "/_layouts/15/";
  13. //Load the JS File
  14. $.getScript(scriptlink + "SP.RequestExecutor.js", loadPage);
  15. });
  16. // Retrieve yhe files
  17. function getQueryStringParameter(paramToRetrieve)
  18. {
  19. var paramsval = document.URL.split("?")[1].split("&");
  20. for (var i = 0; i < paramsval.length; i = i + 1)
  21. {
  22. var singleParam = paramsval[i].split("=");
  23. if (singleParam[0] == paramToRetrieve) return singleParam[1];
  24. }
  25. }
  27. function loadPage()
  28. {
  29. getListItems();
  30. }
  31. //Retrieve all of the list items
  32. function getListItems()
  33. {
  34. var play;
  35. play = new SP.RequestExecutor(applink);
  36. play.executeAsync
  37. ({
  38. url: applink + "/_api/SP.AppContextSite(@target)/web/lists/getbytitle('Custom%20List')/items?@target='" + hostweblink + "'",
  39. method: "GET",
  40. headers:
  41. {
  42. "Accept": "application/json; odata=verbose"
  43. },
  44. success: getitemssuccess,
  45. error: getitemsfailure
  46. });
  47. }
  48. //get all the items on load if the list id found
  49. function getitemssuccess(data)
  50. {
  51. var jsonobj = JSON.parse(data.body);
  52. var selectallitems = document.getElementById("selectalllistitems");
  53. if (selectallitems.hasChildNodes())
  54. {
  55. while (selectallitems.childNodes.length >= 1)
  56. {
  57. selectallitems.removeChild(selectallitems.firstChild);
  58. }
  59. }
  60. var display = jsonobj.d.results;
  61. for (var i = 0; i < display.length; i++)
  62. {
  63. var selectitems = document.createElement("option");
  64. selectitems.value = display[i].Title;
  65. selectitems.innerText = display[i].Title;
  66. selectallitems.appendChild(selectitems);
  67. }
  68. }
  69. //show the reason why the code failed
  70. function getitemsfailure(data, errorCode, errorMessage)
  71. {
  72. alert("Problem loading the list: " + errorMessage);
  73. }
• Click the settings icon on the tool on the left.
  
  
  
  
• Under the properties, select Permissions and provide full control to the App on the Site Collection level.
  
  
  
  
• Click the deploy button on the left and run the project.
  
  
  
  
• Click the launch button.
  
  
  
  
• Choose your list and accept the trust and click on ‘Trust It’.
  
  
  
• Your App will be deployed and will open for you, as per the following screenshot, with all the items from the Custom List.
  
  
  
  
• Here you can see below the list items as per your app display.
  
  
  

Here, we saw today how to get all the list items of a list using REST API in SharePoint Online and Office 365. You will love your App.