JQuery DataTables - Custom Header

3

I researched a lot and could not figure out how to customize the pdf report header that I generated from the plugin; For example, the "sTitle": "Groups" is the title that is in the header, but it comes out with the default styling of the plugin, and also do not know how to add a subtitle with its own style, center, add a date, etc.

The following table call follows:

$("#dinamicTable").dataTable({
    "sDom": 'T<"clear">lfrtip',
    "oTableTools": {
        "sSwfPath": "webroot/libs/datatables/js/media/swf/copy_csv_xls_pdf.swf",
        "aButtons": [ 
            {
                "sExtends": "pdf",
                "sTitle": "Grupos"
            },
            {
                "sExtends": "xls",
                "sTitle": "Grupos"
            }
        ]
    }
});

And the Table:

<table id="dinamicTable" class="table table-bordered table-striped table-condensed">
    <thead>
        <tr>
            <th width="10%">ID</th>
            <th>GRUPO</th>
            <th width="10%">STATUS</th>
            <th width="10%">OPÇÕES</th>
        </tr>
    </thead>
    <tbody>
        <?php foreach ($view_grupos as $grupo) : ?>
            <tr>
                <td><?php echo $grupo['grup_id']; ?></td>
                <td><?php echo $grupo['grup_nome']; ?></td>
                <td align="center"><?php echo $grupo['grup_status']; ?></td>

            </tr>
        <?php endforeach; ?>
    </tbody>
    <tfoot>
        <tr>
            <th>ID</th>
            <th>GRUPO</th>
            <th>STATUS</th>
            <th>OPÇÕES</th>
        </tr>
    </tfoot>
</table>
    
asked by anonymous 09.06.2014 / 20:45

2 answers

2

Man, I've hit my head a lot with this problem. I read a question on the forum / a> and, according to the creator of the functionality Allan Jardine, there is no way to stylize the "sTitle". It does not accept bars, hyphens or certain special characters. The author said he is developing new solutions and looking for a better API.

    
11.06.2014 / 22:17
-1

Use:

var table = $('#dinamicTable').DataTable( {
        responsive: true,
initComplete: function () {
            $('div.fg-toolbar:first').append('<span>Titulo</span>');
        }

.......

    
13.08.2015 / 20:38