How can I add text to my Bootstrap panel header. Datatables DOM.

phpMick

H,

I am using the Datatables dom options to place the table in a Bootstrap panel.

"dom": '<"panel panel-default"<"panel-heading"l>t <"panel-footer"p>>'

How can I get some text in the panel-header?

I'd also like to move the length changing input control to the right.
Thanks,

Mick

phpMick

Move the length changing input with:

.dataTables_length {
    text-align: right;
    display:inline-block;
    vertical-align: top;
    width: 100%;
}

tangerine

Put additional text in the DOM with the Toolbar:
https://datatables.net/examples/advanced_init/dom_toolbar

phpMick

Great, got that working.

Now I need to horizontally align the title and the length changing input control.

I'm trying here:

https://jsfiddle.net/PHPMickB/rbnd1yvh/

Mick

phpMick

I think this is just down to CSS, I'm nearly there with:

.dataTables_length {
    display: inline-block;
    float: right;
}

#table-title {
    display: inline-block;
    margin-right: 15px;
}