Question

我有一个在$（document）.ready函数中创建的表。我也在使用jQuery DataTables插件。出于某种原因，当页面加载时，数据表加载但导出按钮不会。

print("\n".join(lines[-10:])

但它没有显示任何导出按钮，我无法解决，请帮助

我还从dateTable下载构建器

中包含了以下Javascript和CSS

function loadAct() {
            var url = 'http://10.26.192.70/apns/index.php/Busqueda_c/listarAsignaciones';
            $.post(url, {
            }, function (data) {
                var arrayAsignaciones = JSON.parse(data);
                // INGRESA INFORMACION DENTRO DE CADA TABLA DESPUES DE HABER AGREGADO UNA ASIGNACION
                for (i = 1; i < arrayAsignaciones.length; i++) {
                    var str2 = arrayAsignaciones[i].Act_TipoActa;
                    var id2 = str2.replace(/ /gi, '-');
                    var idtable2 = 'table-' + id2;
                    var idtbody2 = 'tbody-' + id2;
                    var table = document.getElementById(idtable2);
                    var tbody = document.getElementById(idtbody2);
                    // Aca comienza la creacion del <tbody> 
                    $(table).find(tbody).append(
                            "<tr>" +
                            "<td>" + arrayAsignaciones[i].Act_Grado + "</td>" +
                            "<td>" + arrayAsignaciones[i].Act_Nombre + "</td>" +
                            "<td>" + arrayAsignaciones[i].Act_Rut + "</td>" +
                            "<td>" + arrayAsignaciones[i].Act_Codigo + "</td>" +
                            "<td>" + arrayAsignaciones[i].Act_Dotacion + "</td>" +
                            "<td>" + arrayAsignaciones[i].Act_FechaInicio + "</td>" +
                            "<td>" + arrayAsignaciones[i].Act_FechaTermino + "</td>" +
                            "<td>" +
                            "<a href='#' onclick='eliminarAsignacion(" + arrayAsignaciones[i].Act_Rut + ", " + arrayAsignaciones[i].Act_Id + ");return false;'>" +
                            "<span class='glyphicon glyphicon-remove' style='margin-left:25px; font-size:15px; color:red;'>" +
                            "</span>" +
                            "</a>" +
                            "</td>" +
                            "</tr>"
                            );

                    // Aca termina la creacion del <tbody> 
                }

                $('.tableBody').DataTable({
                    dom: 'Blfltip',
                    buttons: [
                        'copyHtml5',
                        'excel',
                        'csvHtml5',
                        'pdfHtml5'
                    ],
                        "sDom": 'rt',
                        paging: false,
                        searching: false,
                        ordering: false
                });
            });
        }

这是我使用de dataTabe

的HTML

<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/bs-3.3.6/jq-2.2.3/jszip-2.5.0/pdfmake-0.1.18/dt-1.10.12/af-2.1.2/b-1.2.2/b-colvis-1.2.2/b-flash-1.2.2/b-html5-1.2.2/b-print-1.2.2/cr-1.3.2/fc-3.2.2/fh-3.1.2/kt-2.1.3/r-2.1.0/rr-1.1.2/sc-1.4.2/se-1.2.0/datatables.min.css"/> 
    <script type="text/javascript" src="https://cdn.datatables.net/v/bs-3.3.6/jq-2.2.3/jszip-2.5.0/pdfmake-0.1.18/dt-1.10.12/af-2.1.2/b-1.2.2/b-colvis-1.2.2/b-flash-1.2.2/b-html5-1.2.2/b-print-1.2.2/cr-1.3.2/fc-3.2.2/fh-3.1.2/kt-2.1.3/r-2.1.0/rr-1.1.2/sc-1.4.2/se-1.2.0/datatables.min.js"></script>

CODIGO DOTACION FECHA INICIO FECHA TERMINO ELIMINAR C.P.R. GDO。 12 asdf asdf asdf asdf asdfasdf asdfasdf SEC。 INFORMATICA（P.7）。 2016年3月8日 2016年4月8日

Answer 1

请删除＆＃34; sDom＆＃34;：＆＃39; rt＆＃39; ，这可能会导致此问题。

从你提供的HTML和JS我可以看到你使用了DOM onject如下

   dom: 'Blfltip'

请将其更改为

dom: 'Bfrtip'

这可能是个问题。

还在整个表部分上启动DataTable，而不是在表体上启动。喜欢：

 $('.dataTable').DataTable({

检查是否已包含所有必需的CSS和JS文件。否则你的代码看起来很好。

演示：https://jsfiddle.net/Prakash_Thete/rbunuv9b/2/

参考：https://datatables.net/extensions/buttons/examples/html5/simple.html

数据表导出按钮未显示

1 个答案: