使用 JSON 动态添加表格行答案

【问题标题】：Add table row dynamically with JSON使用 JSON 动态添加表格行
【发布时间】：2018-02-26 09:21:15
【问题描述】：

我很难用 JSON 添加新的表格行。

情况

目前我正在编写拖放功能。文件上传后，文件信息解析为 JSON 并返回查看页面。我想要的是我想用 JSON 文件信息动态添加新的表行。

问题 JSON格式的双引号部分应该如何填写？

var rowNode = table.row.add( [
            "",
            "",
            "[what should i write here??]",
            "[what should i write here??]",
            "<td id=wtax_file_type></td>",
            "<td id=all_tax></td>",
            "<td id=tax_date></td>",
            "<button class='btn btn-xs btn-default'><i class='icon-file-pdf text-error'></i><span> 테스트.pdf</span></button>",
            "<a class='btn-link color-primary'>[이동]</a>"
        ] ).draw().node();

我的 JS 代码

myDropzone.on("success", function(file, res) {


        /* removew preview when upload success*/
        $(file.previewElement).remove();

        console.log(res);

        if (res.result) {
            if (res.data) {
                if (res.data.f_idx) {
                    $('#f_idx').text(res.data.f_idx);
                }
                if (res.data.client_name) {
                    $('#client_name').text(res.data.client_name);
                }
                if (res.data.client_biz_no) {
                    $('#client_biz_no').text(res.data.client_biz_no);
                }
                if (res.data.wtax_file_type) {
                    $('#wtax_file_type').text(res.data.wtax_file_type);
                }
                if (res.data.all_tax) {
                    $('#all_tax').text(res.data.all_tax);
                }
                if (res.data.tax_date) {
                    $('#tax_date').text(res.data.tax_date);
                }
            }
        }

        var fileObj=JSON.parse(res);


       var rowNode = table.row.add( [
            "",
            "",
            "[what should i write here??]",
            "what should i write here??]",
            "<td id=wtax_file_type></td>",
            "<td id=all_tax></td>",
            "<td id=tax_date></td>",
            "<button class='btn btn-xs btn-default'><i class='icon-file-pdf text-error'></i><span> 테스트.pdf</span></button>",
            "<a class='btn-link color-primary'>[이동]</a>"
        ] ).draw().node();


    });

【问题讨论】：

看起来像数据表代码。是吗？
您需要添加一个包含 5 个单元格的新行，其中最后两个包含 button 和 link ？
@SebastienD 是的，我想是的。我想在上传成功后添加带有文件信息的新表行。但我不知道如何在 javascript 中使用 JSON 对象。这是我的数据表的示例图像(ibb.co/hssqYH)
你应该在你的问题中添加datatables标签
@HamzaAbdaoui 我想添加包含 9 个单元格的行。最后两个单元格是下载链接和按钮。这是我现在正在工作的示例表格图片图片网址：ibb.co/hssqYH

标签： javascript jquery json datatables row

【解决方案1】：

根据datatable's documentation，可以这样做：

table.row.add( [
        "",
        "",
        "[what should i write here??]",
        "[what should i write here??]",
        $('#wtax_file_type').text(),
        $('#all_tax').text(),
        $('#tax_date').text(),
        "<button class='btn btn-xs btn-default'><i class='icon-file-pdf text-error'></i><span> 테스트.pdf</span></button>",
        "<a class='btn-link color-primary'>[이동]</a>"
    ] ).draw( false );

【讨论】：