javascript - datatables horizontal scroll bar to be shown on top instead of bottom -

datatables(jquery plugin) has scrollx option, when set true add scroll bar appear @ bottom of table, there option display @ top of table.

not quite impossible.

you find answer @ http://progrnotes.blogspot.com.ee/2013/07/horizontal-scrollbars-at-top-bottom-in-datatables.html: can jquery-doublescroll plugin (https://github.com/sniku/jquery-doublescroll). however, not working datatable loaded ajax. need tweak little.

steps this:

1. download , include doublescroll.

2. add lines:

   $('body').find('.datatables_scrollbody').wrap('<div id="scroll_div"></div>'); $('#scroll_div').doublescroll(); 

3. add css

   .datatables_scrollbody {   overflow-y: visible !important;   overflow-x: initial !important; } 

   that should (datatables 1.10.7)

edit: if have column filters on top above solution needs modifying, otherwise headers won't scroll:

2. add lines:

   $('body').find('.datatables_scroll').wrap('<div id="scroll_div"></div>'); $('#scroll_div').doublescroll(); 

3. add css

   .datatables_scrollbody {   overflow-y: visible !important;   overflow-x: initial !important; } .datatables_scrollhead {   overflow: visible !important; }