Position Export button to the left of Search box
Position Export button to the left of Search box
Hi,
I am trying to position the Export button to the left of the search box on the top right corner of the dataTable
I am using layout to position many custom buttons around the table [top left, top right, bottom left, bottom right] using help from this page: https://datatables.net/reference/option/layout
I already added the following to the layout
_layout:{
topEnd:{
buttons[
{extend:'collection',text:'Export', buttons:['copy','csv','excel','pdf','print']},
],
search {},
},_
But the problem is that the search box appears on top of the "Export" button
Appreciate your help
This question has an accepted answers - jump to answer
Answers
What version of DataTables are you using and what styling framework? With 2.1+ that should layout side by side. 2.0.x it would have been stacked.
If this doesn't help, can you link to a test case showing the issue please.
Allan
Thanks Allan for replying back.
I am using datatable version 1.9. I have special css for the Export button: background color, font size, and border.
This is how it look like right now:

The
layout
option was introduced in Datatables 2.0. In 1.9 you would use thedom
option. You must havedom
configured or are inserting the buttons like this example. Can you post a link to your page or test case replicating the issue so we can help debug?https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case
Kevin
Thanks kthorngren