Prateek
Prateek

Reputation: 105

Can I add a caption to a datatable/html table between thead and tbody?

I want to display text below and above giving user instructions. I'm using jquery dataTables to populate it but table follows HTML in front end. Any suggestions? Here is a JFiddle: http://jsfiddle.net/PrateekParekh/fr2zztL0/6/

$('#source').dataTable({
    "aaData": src,
    "sPaginationType": "full_numbers",
    "bFilter": true,
    "bProcessing": true,
    "bRedraw": true,
    "bDestroy": true,
    "bInfo": false,
    "bLengthChange": false,

    "aoColumns": [
    {"mData": "Module Title"},
    {"mData": "Module ID"},
    {"mData": "Module Language"}
    ]      

    });

Upvotes: 1

Views: 5279

Answers (2)

user8030544
user8030544

Reputation:

You could use this code!
$('#source').append('<caption style="caption-side: top">...</caption>'); $('#source').dataTable({ ... })

This adds a caption to the datatable on the position you chose in the
"caption-side: top/bottom/left/right

Upvotes: 1

markpsmith
markpsmith

Reputation: 4918

Use fnDrawCallback for this. When the table is refreshed, all the data is cleared out so you lose any content added manually. The fnDrawCallback event is fired after each table redraw so we can use it to prepend your message.

'fnDrawCallback': function(oSettings) {
    $("<tr colspan='2'><td>Press Ctrl+Click To select</td></tr>").prependTo("table > tbody");
}

See here for an updated version of your jsfiddle

Upvotes: 1

Related Questions