Move search text box to left side

sibi_karakkattil@hotmail.com

I put the following in .DataTable({, but does not seem to be working. Any help on this is appreciated.

"dom": '<lf<t>ip>'

bindrid

Below? Above? next to the page length drop down?

Left side of t means they go on top. Right side of t puts the control on the bottom.
your adding < and > divs, one around the table and one around all of the controls but does nothing to change their location.

What you want to do is add divs around the controls so that you can override the css defaults.

The example below flips the page length and the filter textbox but hides paging and page info.

you can play with it here: http://live.datatables.net/gigonota/1/edit

I pressed f12 after the page loaded and used the dom explorer to figure out what styles were being applied and how to override them.

<style>
.dataTables_wrapper .myfilter .dataTables_filter {
    float:left
}
.dataTables_wrapper .mylength .dataTables_length {
    float:right
}
</style>
<script>
$(document).ready( function () {
  var table = $('#example').DataTable({
    
    dom:"<'myfilter'f><'mylength'l>t"
  
  });
} );

</script>

vladstheawesome

I have done it this way, which changes the position of the controls as intended but then I lose the paging at the bottom of the report. How do I make sure my pages stays were it is (bottom) when I implement this code?