Learn how to use Dash Bio for next-gen sequencing & quality control. 🧬Register for the Oct 27 webinar.

Datatabe: Move paging controls to different place in the DOM

By default the datatable paging is located below the table on the right. I would like to move the paging div (class previous-next-container) to another place on my page.

In particular, I have a table footer (which carries summary statistics for the table) which is located right underneath the table and I would like to integrate the paging into this table footer. I tried moving the div in the DOM but that trigged JS exceptions.

Do you have an idea how to resolve this issue?

This is the workaround I am using.

.previous-next-container {
position: absolute;
right: 0px;
padding: 0px !important;
color: white;
}
.previous-next-container button {
line-height: normal;
height: 0px;
padding: 0px !important;
}