Articles about European Sharepoint Hosting Service
SharePoint 2013 Hosting – HostForLIFE.eu :: Rest API Get Method Using jQuery Template In SharePoint 2013
Welcome to a blog on getting the data from a list and putting the data in a template. Here, we will discuss a step by step procedure to get the data from a list and place it in a template.
Here, the main code to get the data from a list in detail is given below.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
var requestUrl = _spPageContextInfo.webAbsoluteUrl + "/_api/lists/GetByTitle ('list name')/Items"; // Getting our list items $.ajax({ url: requestUrl, type: "GET", async: false, headers: { "Accept": "application/json; odata=verbose" }, success: function (data) { // Returning the results $.each(data.d.results, function (index, item) { //Append data to the template $("#empTemplate").tmpl(item).appendto("#tbDetails"); }); }, error: function (data) { console.log (data); alert("error " + data) } }) |
In the code given above, we are using a data template with an id “empTemplate” and a table template with an id “tbDetails”. Now, we will create the Data template and table Template, which are given below.
Here is the main code to create the Data template.
1 2 3 4 5 6 7 |
<script id="empTemplate" type="text/x-jQuery-tmpl"> <tr> <td>${EmployeeId}</td> <td>${EmployeeName}</td> <td>${EmployeeDepartment}</td> </tr> </script> |
Here is the main code to create the Table template
1 2 3 4 5 6 7 8 9 10 11 |
<table id="tbDetails" cellpadding="0" cellspacing="0" > <thead style="background-color:#DC5807; color:White; font-weight:bold"> <th>Employee Id</th> <th>Employee Name</th> <th>Employee Department</th> <tr style="border:solid 1px #000000"> </tr> </thead> <tbody> </tbody> </table> |
Now, we will create a container(div) to bind the Data template and Table template
1 |
<div id="empContainer"></div> |
Now, we are applying styles for the table element with the code given below.
1 2 3 4 5 6 7 |
<style type="text/css"> table,th,td { border:1px solid black; border-collapse:collapse; } </style> |
SharePoint 2013 Hosting Recommendation
HostForLIFE.eu’s SharePoint 2013 Hosting solution offers a comprehensive feature set that is easy-to-use for new users, yet powerful enough for the most demanding web developer expert. Hosted SharePoint Foundation 2013 is the premiere web-based collaboration and productivity enhancement tool on the market today. With SharePoint 2013 Foundation, you can quickly access and manage documents and information anytime, anywhere though a Web browser in a secure and user friendly way. SharePoint hosting services start at only at €9.99/mo, allowing you to take advantage of the robust feature set for a small business price. HostForLIFE.eu offers a variety of hosted SharePoint Foundation 2013 plans as well as dedicated SharePoint 2013 Foundation options.
Print article | This entry was posted by Peter on May 31, 2017 at 5:56 am, and is filed under European SharePoint 2013 Hosting. Follow any responses to this post through RSS 2.0. You can leave a response or trackback from your own site. |