1

I'm using the Rest API to pull in data from a SharePoint list and display the results on a webpage. How would I be able to target those two array items? All I'm receiving back in [object Object] [enter image description here

Stuff bordered in green means it's successful and red means that I still have issues.

So I'm able to properly pull in the Franchise Number which is labeled as "Title" but I am unable to pull the results from the "RelatedIssues -> results -> Title" from the array, how would I be able to do that?
enter image description here

Here is a picture of the console showing that I can see the array and that it's pulling both RelatedIssues title results. enter image description here

Code:

<style>
.top {
    margin-bottom: 15px;
}
.csv, .txt, .xls, .xlsx {
    margin-right: 4px;
    margin-left: 4px;
}
</style>

<div id="title" style="width: 100%"></div>

<script>
$(document).ready(function() {
    var requestUri = _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/getbytitle('HISC Franchise Information 2017')/items?$select=Title,RelatedIssues/Title&$expand=RelatedIssues";
    $.ajax({
        url: requestUri,
        type: "GET",
        headers: {
            "accept":"application/json; odata=verbose"
        },
        success: function(data) {
            onSuccess(data);
            ExportTable();
        }
    });

    function onSuccess(data) {
        var item = data.d.results;
        var tableContent = '<table id="TablePanel" border="1px;"><thead><tr><th>Franchise Number</th>' + '<th>Rank</th>' + '<th>Franchises</th>' + '</tr></thead><tbody>';
        for (var i = 0; i < item.length; i++) {
            tableContent += '<tr>'
            tableContent += '<td>' + item[i].Title + '</td>';
            tableContent += '<td>' + item[i].RelatedIssues.results + '</td>';
            tableContent += '<td>' + item[i].Franchises + '</td>';
            tableContent += '</tr>';
            tableContent += '</tbody></thead>';
        }
        $('#title').append(tableContent);
    }

    function ExportTable() {
        $("tableContent").tableExport({
            headings: true,
            footers: true,
            formats: ["xls", "csv", "txt"],
            fileName: "id",
            bootstrap: true,
            position: "top",
            ignoreRows: false,
            ignoreCols: false,
            ignoreCSS: ".tableexport-ignore"
        });
    }
});
</script>
2

Try changing your onSuccess function to this:

function onSuccess(data) {
        var item = data.d.results;
        var tableContent = '<table id="TablePanel" border="1px;"><thead><tr><th>Franchise Number</th>' + '<th>Rank</th>' + '<th>Franchises</th>' + '</tr></thead><tbody>';
        for (var i = 0; i < item.length; i++) {
            var rIssues = "";
            if (item[i].RelatedIssues && item[i].RelatedIssues.results && item[i].RelatedIssues.results.length > 0)
            {               
                rIssues = item[i].RelatedIssues.results.map(function(elem){ return elem.Title; }).join(",");
            }
            tableContent += '<tr>'
            tableContent += '<td>' + item[i].Title + '</td>';
            tableContent += '<td>' + rIssues + '</td>';
            tableContent += '<td>' + item[i].Franchises + '</td>';
            tableContent += '</tr>';            
        }
        tableContent += '</tbody></thead>';
        $('#title').append(tableContent);
    }

Javascript functions that I'm using here are map and join.

  • 1
    Worked like a charm! Thanks again Damjan! I get to learn more about mapping now. – SaintLouis Events Jan 11 at 23:20

Your Answer

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

Not the answer you're looking for? Browse other questions tagged or ask your own question.