4

I am using jquery datatable to add horizontal and vertical scrollbar in a html table. Everything else is working fine except that horizontal scrollbar is not appearing and horizontal content goes out of screen. I am using the following code:

jQuery(document).ready(function(){
    var oTable = jQuery('#example').dataTable( {
    "bPaginate": false,
    "bFilter": false,
    "bInfo": false,
    'bSortable': false,
    "aaSorting": [],
    "bAutoWidth": false,
    "sScrollY": "300",
    "sScrollX": "50%",
    "sScrollXInner": "100%",
    "bScrollCollapse": true
    });
    new FixedColumns( oTable );
});

Changing sScrollX does not change anything. Changing sScrollXInner distorts the table.

Below is the html code of table which is in a div:

<div id="demo">
   <table id="example" class="display" border="0" width="500px" cellspacing="0"
   cellpadding="10" align="center" style="border: solid 1px #dedfe1;">

My requirement is to have a fixed table header and fixed left most column. That is why I am using jquery datatable. Table header is fixed and vertical scrolling is working fine. Horizontal scrolling is not appearing.

Can anybody please help?

Thanx

Vishal Suri
  • 41
  • 1
  • 3

1 Answers1

0

I am not sure this will be helping you for this situation.Just a wild thought why don't you try adding css property overflow-x:scroll

Ravi
  • 3,132
  • 5
  • 24
  • 35