Subject: Vertical scrolling issue in IE7 and above

sawargaonkaramit

Hey Allan,
We are using DataTables in our application.

We have used one DIV tag with overflow=auto in side this DIV we have added DataTable. When we scroll down the page only DIV gets scrolled but not DataTable.

DataTable remains static in its position whereas the other components of the page move vertically up and down based on the scroll direction.

Could you please help me with this issue?

The links to the error images are available below -

Initial Position -
http://designstudio.pineapple.co.in/datatablesissue/1.png

After scrolling down vertically Error Position -
http://designstudio.pineapple.co.in/datatablesissue/2.png

Desired result -
http://designstudio.pineapple.co.in/datatablesissue/3.png

sawargaonkaramit

And the most interesting thing is everything is working VERY FINE with other browsers FF and Chrome. Along with the above Error there is one more error: 'asInitVals' is undefined.

My DataTable is like this:

[code]
$(document).ready(function () {
var oTable = $('.tableGridData').dataTable
({
"bStateSave": true,
"aLengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]],
"sPaginationType": "full_numbers",
"aaSorting": [],
"bRetrieve": true,
"oLanguage":
{ "sSearch": "Search All:" }
});

$("tfoot input").keyup(function () { oTable.fnFilter(this.value, $("tfoot input").index(this)); });
$("tfoot input").each(function (i) { asInitVals[i] = this.value; });
$("tfoot input").focus(function () { if (this.className == "search_init") { this.className = ""; this.value = ""; } });
$("tfoot input").blur(function (i) { if (this.value == "") { this.className = "search_init"; this.value = asInitVals[$("tfoot input").index(this)]; } });
});
[/code]

sawargaonkaramit

Hi Allen,

I am waiting for some inputs from your end. This is an issue that is making the UI fail from client end. Please help me with this issue.

sawargaonkaramit

Hello Allan,
Any updates on this issue?

allan

Sounds like a CSS positional issue to me - do you have position:relative on the DataTables wrapper DIV? If so remove it, if not try adding it - IE positioning is a bit like that...

Failing that I would need a demo showing the issue that I can see this occurring in live please.

Allan