Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP

Loading…

Problems with pager in IE8 #175

Closed
TheSin- opened this Issue · 31 comments

3 participants

@TheSin-
Collaborator

I have the current git truck as of 5 minutes ago, the pager display doesn't show, and when I try to change the value of results per page I get

Webpage error details

User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0; .NET CLR 1.1.4322; .NET CLR 2.0.50727; .NET CLR 3.0.04506.30; .NET CLR 3.0.04506.648; .NET CLR 3.0.4506.2152; .NET CLR 3.5.30729; .NET4.0C; .NET4.0E)
Timestamp: Wed, 14 Nov 2012 23:35:06 UTC

Message: 'length' is null or not an object
Line: 282
Char: 4
Code: 0
URI: http://192.168.1.87/tablesorter/addons/pager/jquery.tablesorter.pager.js

Before updating I couldn't even get the pager to load, so there is progress but wanted to list this, again it works in other browsers, just an IE mess.

@Mottie
Owner

What settings are you using?

I tested the main pager demo in IE7 & IE8 without any problems.

@TheSin-
Collaborator

man I'm having issues I just flushed my cache on safari and now I'm seeing

TypeError: Attempted to assign to readonly property.
line 417 of the pager plugin

this is in safari now :\

anyhow here is my config setup it is very complex (so I'm going to just post the simple version of it) and I might need to turn off my custom plugin to make sure it's not the culprit here. I'm just on my way home from work but I'll look deeper once I'm home.

$(document).ready(function() {
$('#table').tablesorter({
widgets: ['zebra', 'columns', 'stickyHeaders', 'filter'],
sortList: [[9,0], [2,0]]
});
$('#table').tablesorterPager({
container: $('#pager'),
size: 200
});
});

@TheSin-
Collaborator

okay I decided to try first, and it's not my plugin, I disabled it and no change I think disabled the pager and left mine and mine gets the same error, likely since I copied the construct setup from the pager in mine.

so basically line 417 is

c = config.pager = $.extend( {}, $.tablesorterPager.defaults, settings ),

so it's not liking this for some reason since the changes to the main files. Not sure if this helps at all, I'm going to keep looking but I'm still not 100% familiar with the code base.

@TheSin-
Collaborator

changing

c = config.pager = $.extend( {}, $.tablesorterPager.defaults, settings ),

to

c = $.extend( {}, $.tablesorterPager.defaults, settings ),

Fixed it, I'm still testing to see if there is other fallout from it.

nvm this really breaks things, but obviously it thinks config.pager is RO or config at least.

@Mottie
Owner

Not sure why that change made any difference. Just make sure table.config.pager contains all of the pager options.... add another line config.pager = c;.

@TheSin-
Collaborator

changing

c = config.pager = $.extend( {}, $.tablesorterPager.defaults, settings ),

to

c = $.extend( {}, $.tablesorterPager.defaults, settings ),
config.pager = c,

then gives the same error for

config.pager = c,

so it's config it thinks is RO for sure.

@Mottie
Owner

Does the main pager demo work for you in IE8?

@TheSin-
Collaborator

not sure I have to start parallels to test with IE8, but it does work with safari which is where I'm getting the current RO errors from. Once I have it working on Safari again I'll test with IE.

I just grabbed the files again fresh from git and still the same errors.

in your demo you aren't loading the metadata js at all, so I assume that can't be the issue here?

@Mottie
Owner

Nope, honestly I don't use metadata plugin anymore. You can do everything you need with class names or data-attributes.

@TheSin-
Collaborator

well that is great I'm going to drop it form my list too then, but still can't figure my issue :\ I'll keep playing and report back.

@TheSin-
Collaborator

okay the example-pager.html works locally without issues, so obviously it must be my problem, I'll figure it out and stop cluttering up here, I'll reply here once I can test to original issue.

@TheSin-
Collaborator

in firefox i'm seeing

Timestamp: 2012-11-14 7:49:21 PM
Error: TypeError: config is undefined
Source File: http://localhost/tablesorter/addons/pager/jquery.tablesorter.pager.js
Line: 417

any ideas? There is nothing special about the config really I'm so at a loss right now :\

$(document).ready(function() {
$('#table').tablesorter({
widgets: ['zebra', 'columns', 'stickyHeaders', 'filter'],
sortList: [[9,0], [2,0]],
});
$('#table').tablesorterPager({
container: $('#pager'),
size: 200,
});
});

@TheSin-
Collaborator

okay I backed up my git on my tablesorter plugin back to this morning and everything works again. So it has to be table sorter, it's the exact same html code on the page only diff is tablesorter is back to 2.4.5 + that one sticky header change and it all works.

@werian

this.config is undefined with the newest 2.4.7 - whereas it returns an object in the older version.

@TheSin-
Collaborator

I found the issue in the new 2.4.7, it's in widgets, if I remove widgets it works.

I'm going to send you my example. I'm not sure if I can attach it here, do you have an email I can send a zip to?

@TheSin-
Collaborator

Actually just add the widgets js to example-pager.html will do it.

under

<script src="../js/jquery.tablesorter.js"></script>

add

<script src="../js/jquery.tablesorter.widgets.js"></script>

and bam, you get that error.

EDIT

hmm not that easy as it turns out ;)

I'll go back to sending you my example ;)

@TheSin-
Collaborator

okay more testing I'm not sure 100% yet if it's also how I'm loading things using

$(document).ready(function() {

but WORKS
widgets: ['zebra', 'columns', 'filter']

DOES NOT WORK
widgets: ['zebra', 'columns', 'stickyHeaders', 'filter']

So just tested, and it only breaks with 'stickyHeaders' and only is you are loading the config with $(document).ready(function() {

So

WORKS

$(document).ready(function() {
        $('table').tablesorter({
                theme: 'blue',
                widthFixed: true,
                sortList: [[0,0], [2,0]],
                widgets: ['zebra', 'columns', 'filter']
        });
        $('table').tablesorterPager({
                container: $('.pager'),
                size: 10
        });
});

DOES NOT WORK

$(document).ready(function() {
        $('table').tablesorter({
                theme: 'blue',
                widthFixed: true,
                sortList: [[0,0], [2,0]],
                widgets: ['zebra', 'columns', 'stickyHeaders', 'filter']
        });
        $('table').tablesorterPager({
                container: $('.pager'),
                size: 10
        });
});
@TheSin-
Collaborator

Mottie I just sent you my working copy via email so you can test and see this issue yourself.

@Mottie
Owner

Ok, this is what you need to do

$(document).ready(function() {
    $('table')
        .tablesorter({
                theme: 'blue',
                widthFixed: true,
                sortList: [[0,0], [2,0]],
                widgets: ['zebra', 'columns', 'stickyHeaders', 'filter']
        })
        .tablesorterPager({
                container: $('.pager'),
                size: 10
        });
});

The reason you're having problems is because the stickyHeaders widget now adds a new table before the table instead of adding a second thead within the current table. So when you initialize the pager using $('table') it is finding the sticky header table.

@TheSin-
Collaborator

okay thanks I'll test this and let you know right away

@TheSin-
Collaborator

perfect that fixed it for me. I'll make note of that.

Now to test on IE again, and fix my plugin that now breaks with stickyHeaders since it's not part of the same table anymore ;)

So I'll get this issue back on topic now.

wow this new stickyHeader is a real PITA now :( I really hope the benefit was worth it.

@TheSin-
Collaborator

2.4.7 fixed this issue in ie7, thank you.

Now to figure out these new stickyHeaders that broke everything I did and for some reason won't listen to

$('tr td:nth-child(' + (colNum + 1) + ')', table).hide();

since it's a copy of the table and has the same id= table should do both :\ but it doesn't and I assume it's an other rendering order again of some sort, like the .change() is taking a snap shot of before the stickyHeaders exist of something :\ Anyhow thanks again for all the work and fixes!

@Mottie
Owner

DOh I thought I made it remove the id from the cloned table.

Honestly, I liked the last sticky header method. I only changed it because of IE7/8.

@TheSin-
Collaborator

ahhh stupid IE

I'm not upset it's keeping the id, I prefer it, but for some reason even though they both have the same id I can't use

$('#table tr th:nth-child(1)').hide();

the stickyHeader just won't respond at all, I'm even doing this manually ATM for testing and I can NOT get a th in the clone to hide at all :\

@TheSin-
Collaborator

got it working, not what I was hoping for at all, but it works :\

BTW did you see my columnSelector addon I sent you? That is what I was just fixing if you want the fixed version let me know.

@werian

What exactly is different from that snippet you posted Mottie, as I can't get this to work in safari either.

@Mottie
Owner

@wesleyh The table selector $('table') was used twice. The second initialization returns two tables because the first one is cloned. I just chained the tablesorter and tablesorterPager initializations.

@TheSin- I didn't get a chance to look at that addon, what does it do and is there a demo somewhere?

@werian

Well in my case I have a selector with an #id_table, so that should only return once and I still get this error.

@werian

Never mind, I see that you just released a new version to fix this. It works now. Only 1 issue is that the sticky header has now shifted 1 or 2 pixels to the left. Any idea what that could be about? Didn't happen with the previous version.

@werian

Here's an image btw: http://i48.tinypic.com/291zx2h.png -- with sorting and pager turned on. Sometimes going to the next page triggers another shift, or sorting.

@werian

Actually you can probably ignore this, some CSS wasn't reloaded yet.

@Mottie Mottie closed this
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.