Question

我想循环遍历行时动态评估。

概念是“getTable（）”调用将指定REST API的端点，该API将返回页面的JSON对象。我想指定哪些列被渲染，并具有正确的标题。我得到'drawRow（）'函数行：var item = rowData.headers [c];

错误：

TypeError: rowData.headers is undefined
var item = rowData.headers[c];

JSON Response如下所示：

[
  {
    "firstName": "Jay",
    "lastName": "Peace",
    "userName": "jpmyob",
    "createdAt": "2016-05-23T15:10:30.505Z",
    "updatedAt": "2016-05-23T15:10:30.505Z",
    "id": "67431d66d725a478278123d6"
  },
  {
    "firstName": "Alex",
    "lastName": "Cross",
    "userName": "ACross",
    "createdAt": "2016-05-23T15:15:27.560Z",
    "updatedAt": "2016-05-23T15:15:27.560Z",
    "id": "67431e8f24bdaef8379c50c2"
  },
  {
    "firstName": "Jack",
    "lastName": "Reacher",
    "userName": "reacher",
    "createdAt": "2016-05-23T16:27:33.710Z",
    "updatedAt": "2016-05-23T16:27:33.710Z",
    "id": "67432f75eab1ef80139d6953"
  }
]

这是基本页面。

<table border="1">
    <thead id="display-dataLabels">
        <!-- table headers go here -->
    </thead>
    <tbody id="display-data">
        <!-- table rows go here -->
    </tbody>
</table>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

<script>
    function getList( endpoint, headers, columns ) {

        $.ajax({
            url: 'http://localhost:1337/' + endpoint,
            type: "GET",
            dataType: "json",
            success: function( data, textStatus, jqXHR ) {

                // since we are using jQuery, you don't need to parse response
                drawTable( data, headers, columns );

            }

        });

    };


    function drawTable( data, headers, columns ) {

        //clear existing
        $( "#display-data" ).empty();

        //add headers
        var header = $( "<tr />" );
        $( "#display-dataLabels" ).append( header );

        for ( var h = 0; h < headers.length; h++ ) {

            header.append( $( "<td>" + headers[h] + "</td>" ) );

        }

        //add rows
        for ( var r = 0; r < data.length; r++ ) {

            drawRow( data[r], columns );

        }

    };

    function drawRow( rowData, columns ) {

        var row = $( "<tr />" );
        $( "#display-data" ).append( row );

        //resolve each column
        for ( var c = 0; c < columns.length; c++ ) {

            var item = rowData.headers[c];
            row.append( $( "<td>" + item + "</td>" ) );

        }

    };


    getList( 'user', ['USER ID','FIRST NAME','LAST NAME','USERNAME'], ['id','firstname','lastname','username'] );
</script>

Answer 1

error command line: unrecognized line in 'systemLog:'会为您提供密钥columns[c]，id等。然后您可以从行对象firstname

中提取密钥

在javascript中动态评估变量

1 个答案: