数据表 - 导出

时间:2017-05-18 10:36:06

标签: javascript jquery csv datatable datatables

我正在考虑从csv导出按钮向导出datatables添加一些数据,该按钮不在视图的初始表中。

表格标题如下所示,下面的数据按行显示。

ID | Name | Address | Contact | Description

我正在努力获取它,以便在单击导出按钮并生成csv时,会在开头添加一个新行,该行将包含ID和Name之上的两个单元格中的值。将新列添加到表的末尾(在描述字段之后)。

我已经使用“自定义”功能找到的示例进行了测试,但无法使其正常工作。

任何指针都将不胜感激!

我希望看起来如何:

Nickname | Value

Action   | ID    | Name | Address | Contact | Description | Date | Code

编辑:

var table;
$(document).ready(function () {

var filetitle = "file";
if (document.getElementById("csvfilename") !== null) {
    filetitle = document.getElementById("csvfilename").textContent;
}

table = $('.datatables').DataTable({
    "initComplete": function () {
        $('.datatables').attr("hidden", false);
    },
    stateSave: true,
    deferRender: true,
    responsive: {
        details: {
            display: $.fn.dataTable.Responsive.display.childRowImmediate,
            type: ''
        }
    },
    paging: $(".datatables").find("tbody tr").length > 10,
    lengthChange: false,
    dom: 'lfrtip',
    buttons: [
        {
            extend: 'csv',
            title: filetitle,
            exportOptions: {
                columns: ':visible'
            }
        },
        {
            extend: 'excel',
            title: filetitle,
            exportOptions: {
                columns: ':visible'
            }
        }
    ]
});
$(".dt-buttons").hide(); //Hide redundant buttons
table.search("").draw(); //Clear search filter

//Export current table's contents to CSV in browser.
$(".export-csv").on("click", function (e) {
    e.preventDefault();
    table.button('0').trigger()
});

$('.pagelength').on('click', function () {
    var length = $(this).data('value');
    table.page.len(length).draw();
});

$(window).resize(function () {
    table.draw();
});
});

以上是js文件,它将处理视图的数据表,以及按下导出时的代码。

当我尝试实现并改变它时,我遇到了错误。错误是没有使用它。我将其添加到标题选项下的导出按钮中。

customize: function (xlsx) {
    console.log(xlsx);
    var sheet = xlsx.xl.worksheets['sheet1.xml'];
    var downrows = 3;
    var clRow = $('row', sheet);
    //update Row
    clRow.each(function () {
        var attr = $(this).attr('r');
        var ind = parseInt(attr);
        ind = ind + downrows;
        $(this).attr("r",ind);
    });

    // Update  row > c
    $('row c ', sheet).each(function () {
        var attr = $(this).attr('r');
        var pre = attr.substring(0, 1);
        var ind = parseInt(attr.substring(1, attr.length));
        ind = ind + downrows;
        $(this).attr("r", pre + ind);
    });

    function Addrow(index,data) {
        msg='<row r="'+index+'">'
        for(i=0;i<data.length;i++){
            var key=data[i].k;
            var value=data[i].v;
            msg += '<c t="inlineStr" r="' + key + index + '" s="42">';
            msg += '<is>';
            msg +=  '<t>'+value+'</t>';
            msg+=  '</is>';
            msg+='</c>';
        }
        msg += '</row>';
        return msg;
    }

    //insert
    var r1 = Addrow(1, [{ k: 'A', v: 'ColA' }, { k: 'B', v: '' }, { k: 'C', v: '' }]);
    var r2 = Addrow(2, [{ k: 'A', v: '' }, { k: 'B', v: 'ColB' }, { k: 'C', v: '' }]);
    var r3 = Addrow(3, [{ k: 'A', v: '' }, { k: 'B', v: '' }, { k: 'C', v: 'ColC' }]);

    sheet.childNodes[0].childNodes[1].innerHTML = r1 + r2+ r3+ r4+ sheet.childNodes[0].childNodes[1].innerHTML;
}

不确定如何编辑它以将列添加到末尾。

0 个答案:

没有答案