How to Call SharePoint 2013 API Service to Query The Lists

How to Call SharePoint 2013 API

In SharePoint 2013, we can query the list by it owner service, then dynamic load the info of the list items to render in client.

Here is the require, dynamic load the info about the list named link and show to the page in datail.

Here is my steps:

1. Create a link list named "Links", and create a column named "Category", the column is use for category the links, and filter the items. the add some items.

2.  Edit the page that you want to show the Links list items. and add the webpart named Script Edittor to store the js code. then edit the webpart and add the js code into the webpart.

 Here is the code:

<script src="http://code.jquery.com/jquery-1.10.2.js"></script>  
</script>
 
$(document).ready(function () {
  ExecuteOrDelayUntilScriptLoaded(getLinksInfo, "sp.js");
});
function getLinksInfo() {

    var requestUri = "http://dev-sp"+ "/_api/Web/Lists/getByTitle('Links')/items";
    var ulIcons = $("#test");

    $.ajax({
        url: requestUri,
        type: "GET",
        headers: { "ACCEPT": "application/json;odata=verbose" },
        success: function (data) {

            var items = "";
            $.each(data.d.results, function (index) {
                       switch ($(this).attr("Category")) {
                        case "Operations":
                            items += "<li><a href='mailto:" + $(this)[0].URL.Url+ "'>" + $(this)[0].URL.Description + " -  Operation" + "</a></li>"
break;
                        case "Marketing":
                            items += "<li><a href='" + $(this)[0].URL.Url + "'>" + $(this)[0].URL.Description + " - Markrting" + "</a></li>"
                         break;
                    }
               
            });

            if (items != "") {
                ulIcons.html("");
                ulIcons.html(items);
            }
        },
        error: function (e) {
            alert("Failed to get Escalations Icons!");
        }
    });
}

</script>

3. Clicke "Ok" abdou the script webpart and save the page. It wiil show the result