javascript 带有REST API调用的Html表

Posted 2021-05-03

    var customerNames = "/_api/Web/Lists/GetByTitle('Customer-Database-V1')/Items?"+
                   "$select=ID,Title,Abbreviation";


    $.ajax(
    {

    url: _spPageContextInfo.webAbsoluteUrl + customerNames,
    type: "GET",
    headers: {
    "accept": "application/json;odata=verbose",
    },
    success: function (data) {
    readAllSuccess(data);
    },
    error: function (err) {
    alert(JSON.stringify(err));
    }
    }
    );
    },

    readAllSuccess = function (data) {
    var html = [];
    html.push("<table><thead><tr><th>ID</th><th>Customer Name</th>" +
    "<th>Customer Abbreviation</th><th>POD URL</th></tr></thead>");

    var results = data.d.results;
    console.log(data.d.results);

    for(var i=0; i<results.length; i++) {
    html.push("<tr><td>");
    html.push(results[i].ID);
    html.push("</td><td>");
    html.push(results[i].Title);
    html.push("</td><td>");
    html.push(results[i].Abbreviation);
    html.push("</td><td>");
    html.push(results[i].POD_x002d_URL);
    html.push("</td></tr>");
    }
    html.push("</table>");
    $('#displayDiv').html(html.join(''));