Position Export button to the left of Search box

Position Export button to the left of Search box

wijwijwijwij Posts: 54Questions: 12Answers: 0
edited September 9 in Buttons

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

Answers

  • allanallan Posts: 63,676Questions: 1Answers: 10,497 Site admin

    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

  • wijwijwijwij Posts: 54Questions: 12Answers: 0
    edited September 9

    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:

  • kthorngrenkthorngren Posts: 21,443Questions: 26Answers: 4,974

    The layout option was introduced in Datatables 2.0. In 1.9 you would use the dom option. You must have dom 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

Sign In or Register to comment.