how to customize bootstrap datatable search box and records view position

Question

I have a problem when i was create datatable with bootstrap styling. i got datatable from this site (http://datatables.net/manual/styling/bootstrap)

i found less in accordance with the view that I have created. I make the navbar above table. so I want to make search box and view the records I put in navbar-right. as this is what I want.

before:

i want to be like this

how to customize this? where the javascript code that must be changed or just enough customization with jquery?

Answer 1

http://datatables.net/examples/basic_init/dom.html

read carefull then come and read the rest of the comment here is an example:

when you understand write

     $('#example').dataTable({


      "dom":' <"search"f><"top"l>rt<"bottom"ip><"clear">'
    }


      );
});

this will make the search box has a class named "search" and leave everthing else as it is now you can easily edit the position of the search box using css if you want to do like the picture you posted just write

"dom":' <"search"fl><"top">rt<"bottom"ip><"clear">'