Datatables - Экспорт значений внутри и вне поля ввода и значения поля выбора - PullRequest
0 голосов
/ 23 октября 2018

давайте посмотрим, кто может помочь мне решить эту проблему.

У меня есть несколько таблиц с плагином JS datatables (https://datatables.net/)

Моя проблема заключается в экспорте данных в PDF и Excel.

Я не могу экспортировать в PDF или Excel значения, которые находятся внутри полей ввода или выбора (только выбранное значение)

У меня есть несколько таблиц, в которых есть входные столбцы, другой столбецвыделяет и другой столбец простой текст. Я хотел бы знать, как я могу сделать, чтобы экспортировать все эти значения в Excel или PDF, если вы можете с этим плагином. Пока я не смог его получить.

Table with simple text and inputs

Вот выдержка из моего кода для построения таблицы данных:

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:

OUTPUT in PDF

Я надеюсь, что мог бы предоставить достаточно информации, чтобы решить эту проблему, если она может быть решена. И если требуется дополнительная информация, не стесняйтесь сообщить мне.

СпасибоВы очень много заранее

Ответы [ 3 ]

0 голосов
/ 19 февраля 2019

Я недавно боролся с этим и наконец нашел решение.Я попытаюсь сделать это немного более детальным.

Вот функция, которая проверяет, является ли экспортируемый узел узлом.В таком случае он возвращает значение 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'
        } )
        ],
0 голосов
/ 20 августа 2019
var buttonCommon = {
    exportOptions: {
        format: {
            body: function(data, column, row, node) {
                if (row == 1) {
                    return $(data).is("div") ? $(data).text() : data
                }
                else  if (row == 4) {
                    return $(data).is("select") ? $(data).val() : data
                }
                else {
                    return $(data).is("input") ? $(data).val() : data
                }
            }
        }
    }
};
$(document).ready(function() {
    $('#Goal_tables').DataTable({
        dom: 'Bfrtip',
        "paging": !1,
        buttons: [$.extend(!0, {}, buttonCommon, {
            extend: "excel"
        })]
    })
});
0 голосов
/ 02 ноября 2018

хорошо, в вашей кнопке

                        exportOptions: {
                        orthogonal: 'export',
                    }

в ваших столбцах:

            render: function (data, type, row) {
            return type === 'export' ? row.Descripcion: "";
        }
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...