Themeroller - IE does not honor disabled page numbers in pager

Themeroller - IE does not honor disabled page numbers in pager

paulsperanzapaulsperanza Posts: 6Questions: 0Answers: 0
edited March 2010 in Bug reports
Al,

If you run your themeroller example (http://datatables.net/styling/themes) in Chrome, Firefox and Safari you will see disabled page numbers if you are on the first page.

Run it in IE (8) and the page numbers will not be disabled. Is this something from your end? I would dig in but I am swamped, sorry.

Thanks,
Paul Speranza

Replies

  • noelnoel Posts: 10Questions: 0Answers: 0
    I have figured out what is going on here. It has to do with the use of fg- vs ui- classes.

    I could not find the project on Github to fork and make changes. Is it somewhere simple to make changes and submit for review?

    There is still a problem in IE when you go to the next page additional page numbers are added
    http://twitpic.com/2ds0c9/full

    I believe the problem is in this area
    nPaginateList = an[i].childNodes[2];
    nPaginateList.innerHTML = sList;

    If you add this right after you will see the number of spans increases in IE, but not in Safari.

    alert($("div.dataTables_paginate span").length);

    Any ideas?
  • allanallan Posts: 61,627Questions: 1Answers: 10,090 Site admin
    If you can provide a diff with your changes that would be perfect. Adding the source to github is one of the things I've still to get around to doing...

    Is it just a case of me using the wrong classes by default?

    Allan
  • noelnoel Posts: 10Questions: 0Answers: 0
    Allan,

    Have a look at this for the changes
    http://www.pastie.org/1086874

    Do you have any ideas on the extra SPANS? I've spent all day on this trying to get this done by tomorrow and this is my remaining issue. Even thought of doing a post load jquery hack, but haven't been able to figure it out.
  • noelnoel Posts: 10Questions: 0Answers: 0
    Allan,

    Dont know how I missed this, but the problem is that the SPAN with Previous is getting overwritten with the page numbers. Look at my picture

    http://twitpic.com/2ds0c9/full

    Getting closer.

    Noel
  • noelnoel Posts: 10Questions: 0Answers: 0
    This fixes the double page numbers

    I commented this out
    /* Build up the dynamic list forst - html and listeners */
    //nPaginateList = an[i].childNodes[2];
    //nPaginateList.innerHTML = sList;

    and did this instead
    x = $("div.dataTables_paginate span:eq(2)");
    if ( x.children().size() == 0 ) {
    x.html(sList);
    }

    There is still a problem with the classes applied to disabled First, Previous, Next, Last
  • noelnoel Posts: 10Questions: 0Answers: 0
    Okay, here is a good workaround

    Changed this part
    /* Build up the dynamic list forst - html and listeners */
    nPaginateList = an[i].childNodes[2];
    // THIS IS THE PROBLEM ---> nPaginateList.innerHTML = sList;
    x = $(an[i]).find("span:eq(2)");
    x.html(sList);

    And to fix the "non-enabling" First and Last I had to take out the corners, just have
    "sPageFirst": "first",
    "sPageLast": "last",
  • allanallan Posts: 61,627Questions: 1Answers: 10,090 Site admin
    Very interesting! Thanks for the investigation noel! I'll have a look at including this fix in the next release.

    Regards,
    Allan
  • noelnoel Posts: 10Questions: 0Answers: 0
    Allan,

    Note that I didnt do any sort of testing without the jQueryUI theme, not sure if anything broke there.

    Do get it on Github. That will make it simpler to contribute for all.

    -Noel
  • UPEngineerUPEngineer Posts: 93Questions: 0Answers: 1
    noel,

    I have tried your fixes in both the css as well as the .js code.

    It works great in IE, however, now in Firefox and Chrome, the numbers are "bunched" together.

    Could I have missed something? Any ideas?
  • UPEngineerUPEngineer Posts: 93Questions: 0Answers: 1
    Well I think I figured it out.

    If I leave out the margin: 0 in the updated css file, it seems to work.

    But now I have another issue. The "toolbar" or whatever it is called that holds the search box and the Displaying xxx of xxxx is compressed and not full size. I will investigate to see if I can figure this out.
  • UPEngineerUPEngineer Posts: 93Questions: 0Answers: 1
    Never mind, I figured out all my problems.

    I still had fg-toolbar instead of ui-toolbar in all my datatables declarations. :)

    Thanks for the update and now IE displays the numbers correctly!!!!
  • noelnoel Posts: 10Questions: 0Answers: 0
    Great, now lets see if we can figure out my filtering issue :)

    http://datatables.net/forums/comments.php?DiscussionID=2512&page=1#Item_1

    I am wondering if these two issues are red hearings pointing to other IE vs everybody JS issues.
    I noticed that you don't always use jQuery functions for JS operations.
  • noelnoel Posts: 10Questions: 0Answers: 0
    I went back to 1.6 to fix the filtering problems. I only changed all the fg- to ui- and took out the rounding classes on first and last and all worked properly in IE.

    E.g. I did NOT have to apply this from above

    /* Build up the dynamic list forst - html and listeners */
    nPaginateList = an[i].childNodes[2];
    // THIS IS THE PROBLEM ---> nPaginateList.innerHTML = sList;
    x = $(an[i]).find("span:eq(2)");
    x.html(sList);

    I'm worried about what else may have broken in 1.7
  • allanallan Posts: 61,627Questions: 1Answers: 10,090 Site admin
    Okay I think I understand what is happening here. ThemeRoller 1.8 introduced a few small changes, such as fg-button being renamed to ui-button. noel's patch takes care of this, which I've applied. However, I've also retained the 1.7 theme classes for the moment, in order to retain backwards compatibility (since many DataTables' installs use ThemeRoller 1.7). I've updated the distribution to use 1.8.4 (current stable) by default.

    Regarding the problem with the spans - I've not been able to reproduce this, but I've altered the code to make use of selectors rather than making an assumption on the structure of the DOM.

    These updates will be released with DataTables 1.7.1.

    Regards,
    Allan
This discussion has been closed.