Weired behaviour of jquery datatables pulgin's fixed column in IE 9

Weired behaviour of jquery datatables pulgin's fixed column in IE 9

zeshan759zeshan759 Posts: 1Questions: 1Answers: 0
edited May 2015 in Free community support

I am using jquery ui tabs to display two grids side by side within same div. Grid are displayed using jquery datatables plugin.
Recently i have added the feature of fixed columns in both of my grids, that makes IE 9 behave weirdly at random.
This behavior happen at total random but on one of the two grids not on both. IE 9 display fixed column portion over the horizontal scroll-bar.
Funny thing is if you sort out the affected table or enter some characters in search textbox, this overlapping portion got fixed automatically.

I search on it and came to know that draw() function is called on these actions so i tried to call this function manually on tab selection event but that didn't solve the problem.

Below is the JS code for tab selection event:
`$('#divEAMountDismountGridsTabs, #CurrentSpec').tabs(
{
select: function(event, ui)
{
// Do stuff here
var tempDismount = $('#tblDismountAtt').DataTable();
tempDismount.draw(false);

            var tempCurrentSpec = $('#tblCurrentSpec1').DataTable();
            tempCurrentSpec.draw(false);
        }
    });`

Below is the JS i write on datatable initialization(both grids got the same attributes so i am just copying the initialization of first grid).

var tableDismountAtt = $('#tblDismountAtt').dataTable( { "bFilter": true, "bInfo": false, "bDestroy": true, "bwidth": '100%', //"sDom": '<"top"f>', 'iDisplayLength':5000, "order": [[2, "asc"]], dom: "Cfrtip", scrollY: "140px", scrollX: "100%", paging: false, scrollCollapse: true, "aoColumnDefs" : [ {'bSortable' : false, 'aTargets' : [ 0 ] , "width": "80px"}, //Switch to Dismount {'bSortable' : false, 'aTargets' : [ 1 ], "width": "80px"}, //Parts Status {'bSortable' : true, 'aTargets' : [ 2 ], "width": "80px"}, //Sales Code {'bSortable' : true, 'aTargets' : [ 3 ] , "width": "60px"}, //Price {'bSortable' : false, 'aTargets' : [ 4 ], "width": "60px"}, //Currency {'bSortable' : true, 'aTargets' : [ 5 ], "width": "150px"}, //Sales Cod Description {'bSortable' : false, 'aTargets' : [ 6 ], "width": "80px"}, //Quantity {'bSortable' : false, 'aTargets' : [ 7 ], "width": "380px"}, //Remarks {'bSortable' : true, 'aTargets' : [ 8 ], "width": "80px"}, // PSO Ref No. {'bSortable' : false, 'aTargets' : [ 9 ], "width": "150px"}, //Model Sub Name {'bSortable' : false, 'aTargets' : [ 10 ] , "width": "80px"}, //Value {'bSortable' : false, 'aTargets' : [ 11 ], "width": "150px"}, //Date {'bSortable' : true, 'aTargets' : [ 12 ]}, {'bSortable' : true, 'aTargets' : [ 13 ]}, {'bSortable' : true, 'aTargets' : [ 14 ]} ] }); /*Freezing Dismount Attachment Columns*/ new $.fn.dataTable.FixedColumns( tableDismountAtt, {leftColumns: 6, heightMatch:'auto'});

This discussion has been closed.