Datatable inside dialog box cannot be scrolled in IE7
Datatable inside dialog box cannot be scrolled in IE7
I have a data table inside a JQuery UI dialog box. In IE7, no scrollbar appears. firefox 3, google chrome, and IE8 look ok.
link here:
http://www.favorfavorbaby.com/mm5/merchant.mvc?Screen=PROD&Product_Code=20073NA&savedReviews=1
edit: oh I forgot, to see the dialog box you have to click the "View all reviews" link toward the bottom right of the page
thanks in advance for any help.. not sure how to solve this
edit2: here's the relevant code to save anyone the trouble of digging around
java:
if ( $("#viewAllReviews").length ) {
$("#viewAllReviews").click(function(event){
event.preventDefault();
pageTracker._trackEvent('Products', 'All Reviews Viewed', prodID );
if ( !$("#allReviewsDialog").dialog( "option", "height" ) ) {
$("#allReviewsDialog").dialog({
bgiframe: true,
height: 545,
width: 675,
modal: true
}).load( $(this).attr("href"), function(){
$(document).ready(function(){
$("head").append("");
$("#allReviewsTable").dataTable({
"bPaginate": false,
"bFilter": false,
"aaSorting": [[1,'desc']],
"aoColumns": [
null,
{ "iDataSort": 2 },
{ "bVisible": false },
{ "bSortable": false }
]
});
});
});
} else {
$("#allReviewsDialog").dialog( "open" );
}
return false;
});
}
HTML:
All Reviews for Bun In The Oven Candle Favors (Set of 4)
Rating
Date
DateSort
Review
5/16/2009
May 16, 2009 9:22 PM
Bun in the oven shower favors
very cute, loved them!
- Karen (Aguanga, CA)
...........................................................................
link here:
http://www.favorfavorbaby.com/mm5/merchant.mvc?Screen=PROD&Product_Code=20073NA&savedReviews=1
edit: oh I forgot, to see the dialog box you have to click the "View all reviews" link toward the bottom right of the page
thanks in advance for any help.. not sure how to solve this
edit2: here's the relevant code to save anyone the trouble of digging around
java:
if ( $("#viewAllReviews").length ) {
$("#viewAllReviews").click(function(event){
event.preventDefault();
pageTracker._trackEvent('Products', 'All Reviews Viewed', prodID );
if ( !$("#allReviewsDialog").dialog( "option", "height" ) ) {
$("#allReviewsDialog").dialog({
bgiframe: true,
height: 545,
width: 675,
modal: true
}).load( $(this).attr("href"), function(){
$(document).ready(function(){
$("head").append("");
$("#allReviewsTable").dataTable({
"bPaginate": false,
"bFilter": false,
"aaSorting": [[1,'desc']],
"aoColumns": [
null,
{ "iDataSort": 2 },
{ "bVisible": false },
{ "bSortable": false }
]
});
});
});
} else {
$("#allReviewsDialog").dialog( "open" );
}
return false;
});
}
HTML:
All Reviews for Bun In The Oven Candle Favors (Set of 4)
Rating
Date
DateSort
Review
5/16/2009
May 16, 2009 9:22 PM
Bun in the oven shower favors
very cute, loved them!
- Karen (Aguanga, CA)
...........................................................................
This discussion has been closed.
Replies
The jQuery UI group is a good place to get help for this kind of thing: http://groups.google.com/group/jquery-ui?pli=1
Regards,
Allan
with datatables turned off, but still showing the table as it would display normally, the section scrolls correctly
I have the same issue. How did you end up resolving it?
Thanks,
Joel
I have the same issue, spent several hours searching on the internet without any lucks. The table looks fine when it fits inside the dialog. But when it grows beyond the preset area on the dialog, the table's scrollbar does not appear, in stead, the scrollbar of the dialog appear and when you scroll it, only other elements of the dialog move, not the table.
I have done the following changes:
1. I set the data table to display 5 rows per page by using
bLengthChange: true,
iDisplayLength: 5
-->Not working, no paging display
2. Set bgiframe: true for dialog
-->still not working.
Any help will be greatly appreciated.
Thanks,
Any work around way ? If yes, mind to share your coding ?
Thank you.
Please help