Retrieve Data from SharePoint List using REST api

Retrieve Data from SharePoint List using REST api jQuery

<script type="text/javascript" src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.12.4.min.js"></script>
 <script type="text/javascript">
var listName = "ListB";
    // This code runs when the DOM is ready and creates a context object which is needed to use the SharePoint object model
    $(document).ready(function () {
        GetEmployeeDetails();
    });

    function GetEmployeeDetails() {

        $.ajax({
            url: _spPageContextInfo.siteAbsoluteUrl + "/_api/web/lists/GetByTitle('" + listName + "')/items?$Select=Title,EmployeeName,Salary,Dept/Title,Dept/Code,Dept/pqol&$expand=Dept",
            type: "GET",
            headers: { "Accept": "application/json;odata=verbose" }, // return data format
            success: function (data) {
                //console.log(data.d.results);

                var table = $("#tblEmployees");
                var html = "<thead><tr><th>Title</th><th>EmployeeName</th><th>Salary</th><th>DepartmentName</th><th>DepartmentCode</th></tr></thead>";

              $.each(data.d.results, function (key, value) {
           html += "<tr><td>" + value.Title + "</td><td>" + value.EmployeeName + "</td><td>" + item.Salary + "</td><td>" + value.Dept.Title + "</td><td>" + value.Dept.Code + "</td></tr>";
       
    });
                table.html(html);
            },
            error: function (error) {
                alert(JSON.stringify(error));
            }
        });

    }
</script>

<table> 
     <tr> 
         <td> 
 
             <table id="tblEmployees" class="mytable"> 
             </table> 
 
         </td> 
     </tr> 
 </table>


<style>
.mytable {
width: 100%;
border-collapse: collapse;
}
.mytable td, .dataTbl th {
    border: 1px solid #0072c6;
    padding: 8px;
}
.mytable th {
    color: #fff;
    background-color: rgb(66, 139, 202);
    font-weight: normal;
    padding: 10px;
    font-size:14px;
}

</style>

Comments

Popular posts from this blog

Customizing SharePoint list and implementing Quick search using jQuery

Enable and Disable Client side People Picker using jQuery

Populate dropdown using jquery ajax in SharePoint