javascript - Datatables - 导出字段输入内外的值和选择字段的值

Question

让我们看看谁能帮我解决这个问题。

我有几个带有 JS 数据表插件的表 ( https://datatables.net/ )

我的问题是导出 PDF 和 Excel 中的数据。

我无法将输入或选择字段内的值导出为 PDF 或 Excel(仅选定的值)

我有几个表，其中有输入列，另一列选择和另一列简单文本。我想知道如何将所有这些值导出到 Excel 或 PDF，如果可以使用此插件。到目前为止我还没有得到它。

这里是我构建数据表的代码的摘录:

var tabla_table = $('#table').DataTable({
    dom: 'Blfrtip',
    buttons: [{
            extend: 'collection',
            text: "<i class='fa fa-cog'></i>",
            buttons: [
              {
                  extend: 'pdfHtml5',
                  orientation: 'landscape',
                  customize: function ( doc ) {
                    doc.defaultStyle.fontSize = 10;  
                  },
                  exportOptions: {
                    columns: ':visible',
                    columns: ':not(.no-print)',
                  /*  format: {
                    body: function ( data, row, column, node, sValue, nTr, type ) {
                      //
                      //check if type is input using jquery
                    //  console.log('data val: ' + $(data).val() );
                      console.log('data: ' + data );
                      console.log('row: ' + row );
                      console.log('nTr: ' + nTr );
                      console.log('node: ' + node );
                      console.log('type: ' + type );
                      /*if( $(data).is("input") ){
                        return data;     
                      }else{
                        return $(data).val();  

                      }

                      }
                    }*/
                    //columns: [4, 8, 9, 10, 11, 12, 13, 14]
                  }
              },{
                  extend: 'excel',
                  orientation: 'landscape',
                  exportOptions: {
                    columns: ':visible',
                    columns: ':not(.no-print)',
                    format: {
                    body: function ( data, row, column, node ) {
                      //
                      //check if type is input using jquery
                      //console.log('PRUEBA: ' + $(data).val() );
                      if( $(data).is("input") ){
                        return data;     
                      }else{
                        return $(data).val();  

                      }

                      }
                    }
                    //columns: [4, 8, 9, 10, 11, 12, 13, 14]
                  }
                },{
                  text: 'Imprimir',
                  extend: 'print',
                  orientation: 'landscape',

                  exportOptions: {
                    columns: ':visible',
                    columns: ':not(.no-print)'
                  }
                },
               /* 'colvis'*/

            ]
        }

    ],.....

以 PDF 格式输出:

如果可以解决的话，我希望我能提供足够的信息来解决这个问题。如果需要更多信息，请随时告诉我。

非常感谢您

Answer 1

我最近一直在努力解决这个问题，终于找到了解决方案。我会尽量让它更详细一些。

这是一个检查导出节点是否为节点的函数。在这种情况下，它返回 input.value - 否则只是数据:

//function for DataTable data export to export <input>.value
var buttonCommon = {
    exportOptions: {
        format: {
            body: function ( data, row, column, node ) {
                //check if type is input using jquery
                return node.firstChild.tagName === "INPUT" ?
                        node.firstElementChild.value :
                        data;

            }
        }
    }
};

现在，定义了这个函数，我们用它来扩展按钮:

    buttons: [
        $.extend( true, {}, buttonCommon, {
            extend: 'copyHtml5'
        } ),
        $.extend( true, {}, buttonCommon, {
            extend: 'excelHtml5'
        } ),
        $.extend( true, {}, buttonCommon, {
            extend: 'pdfHtml5'
        } ),
        $.extend( true, {}, buttonCommon, {
            extend: 'csvHtml5'
        } )
        ],