Question

每次页面加载时，我都会动态创建一个textarea。

"aoColumnDefs": [
            {
                "aTargets": [4],
                "createdCell": function (td, cellData, rowData, row, col) {
                    $(td).html('<textarea name="playerProfile" class="playerIfo" spellcheck="true" rows="2" cols="60"> </textarea>  ');

                }
            }

我正在阅读JSON，然后存储到数组中。我还有一个名为userProfile的全局变量，并为其分配JSON字段的值。我已尝试尝试各种方法在将其推入我的数组后动态加载文本字段中的字段，但这似乎不起作用。我可以看到每个userProfile的状态，但是，我似乎无法进入textarea。我没有在控制台中看到任何空值或错误，因此我得出结论我加载到textarea的方式不正确。代码如下。

function getPlayerData() {
    $.ajax({
        url: urlToUse,
        dataType: 'json',
        type: 'GET',
    }).done(function (response) {
        renderTeamPlayerData(response);
    });
}
    function renderTeamPlayerData(result){ 
          var DataArray = [];
          var monthNames = ["Jan", "Feb", "Mar", "Apr", "May", "Jun",
          "Jul", "Aug", "Sept", "Oct", "Nov", "Dec"
          ];
         $.each(result.players, function () {
            userProfile = this.userProfile;
            console.log("starting player profile -> " + userProfile );
            var rawDate = new Date(this.contractUntil);
            var datePretty = monthNames[rawDate.getMonth()] + ", " + (rawDate.getDate()) 
            + " " + rawDate.getFullYear();
            DataArray.push([this.name,
                            this.nationality,
                            this.position,
                            userProfile,
                            datePretty
            ]);
            console.log("player profile -> " + userProfile );
            $(this).closest('tr').find('.playerIfo').text(userProfile );
            //$(this).closest('tr').find('.playerIfo').val(userProfile );
            console.log("player profile after -> " + userProfile );
            //$(this).closest('table tr>td').find('textarea').val(userProfile);
            //$(".playerIfo").text(userProfile);
            //$('textarea[name=playerProfile]').innerHTML =userProfile ;
        });
        $('#playerTable').dataTable().fnAddData(DataArray);
        $('#playerTable').dataTable().fnAdjustColumnSizing();
    }

有人能告诉我一种动态加载JSON字段（我已存储在数组中）的方法吗？

Answer 1

你正在倒退。您正在尝试在创建表元素之前插入userProfile，即在fnAddData(DataArray)之前插入userProfile。

由于数据中存在$(this).closest('tr').find('.playerIfo').text(userProfile );，因此无需按代码注入。移除createdCell()并使用render()回调代替"aoColumnDefs": [{ "aTargets": [4], "render": function(data, type, full, meta) { if (type == 'display') { return '<textarea name="playerProfile" class="playerIfo" spellcheck="true" rows="2" cols="60">' + data + '</textarea>'; } return data } }]：

main.ts

将JSON值加载到dataTables textarea字段中

1 个答案: