Retrieve one library from each site and show the last item using ajax

Question

My senario is like this:

In every site there is a list called Projects. I need to loop through each sub site and retrieve the last item from Projects list, and display them on a page in tabular fashion. So, the function should perform an aggregation of all last items retrieved from each list.

I have this bit, but I am not sure how to proceed any further:

$(document).ready(function(){
    $.ajax({
        url: _spPageContextInfo.siteAbsoluteUrl + "/_api/web/webs?$expand=Webs",
        method: "GET",
        headers: {
            "Accept": "application/json; odata=verbose"
        },
        success: function(data) {       
            for(i=0;i<data.d.results.length;i++){
                console.log(data.d.results[i].Title;

                    $.ajax({
                                type: "GET",
                                url: data[i].__metadata.uri + "/lists/GetByTitle('Projects')/items?&$orderby=Id desc&$Top=1",
                                headers: {
                                    "Accept": "application/json; odata=verbose"
                                },
                                success: function(data) {
                                    console.log(data);
                                    for(i=0;i<data.d.results.length;i++){

                                        console.log("  =>" + webUrl + " " +data.d.results[i].Title + " " + data.d.results[i].rcBudget);
                                    }
                                }
                            });
            }
        },
        error: function(rootsite) {console.log("error   ");},
        async: false
    });     
});

EDIT 1:

I have inserted another ajax call, but how do I get the web url together with the items queryed out of the ajax call and use them as a collection?

I need to display something like this:

WebUrl |  Field 1 | Field 2  | Field 3 etc
web 1  |  value 1 | value 2  | value 3
web 1  |  value 1 | value 2  | value 3

Answer 1

Disclaimer: I havn't got time right now to write up a full guide on how to do this, so for now I will just give you some pointers.

You would need to loop the result from your AJAX call to get the ServerRelativeUrl for each subsite. Then once that is done - and still inside that loop - you would need to make another call to the library called projects using the url + the list endpoint /_api/web/lists/GetByTitle('Projects')/items?&$orderby= Id desc&$Top=1

The results of this call would be the last item in the list called 'Projects'. From there is just a matter of getting the fields from the item and add in to the html in the page using javascript (Jquery).