www.webdeveloper.com
Results 1 to 13 of 13

Thread: [RESOLVED] Print page shows unchanged checkbox in IE with DocType

Hybrid View

  1. #1
    Join Date
    Aug 2010
    Posts
    6

    resolved [RESOLVED] Print page shows unchanged checkbox in IE with DocType

    Hi Guys,

    Strange problem. I have a simple webform where users can fill in text and check/uncheck some checkboxes. When this is printed to pdf or paper (or print preview) in IE (7 or 8) the checkboxes are printed unchanged. E.g. user sets a check, this is printed unchecked ... or with a pre-checked box with the user unchecked, is printed checked.

    Same goes for the radio.

    Only when I remove the DocType completely, IE prints it correctly. But I need to use XHTML-strict.

    This is the simples example which fails in IE:

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" lang="nl" xml:lang="nl-NL"> 
    <body>
    <input type='checkbox' name='y'/><br/>
    <input type='radio' name='x'/><br/>
    </body>
    </html>
    Doesn't work with any doctype I tested (loose or html4).

    Anyone a idea how to solve this?

    Many thanks,
    Michael

  2. #2
    Join Date
    Apr 2003
    Location
    Netherlands
    Posts
    21,654
    Works correctly with any DTD in IE.

    Why must you use xhtml when IE does not support it?

  3. #3
    Join Date
    Aug 2010
    Posts
    6
    Hi Fang ... it shows correctly on screen, but does not print (preview) the checked boxes.

    It will be a public form and must be rendered the same in any browser, which it does already. And the form will be used on a website which is in xhtml. There might be a (small) chance that we use a different doctype for this page, but nothing seems to work. I definitely don't want to use IE quirks-mode for obvious reasons.

    If anyone has a html-snipplet, or sample site, working in IE please let me know.

    Thanks!

  4. #4
    Join Date
    Apr 2003
    Location
    Netherlands
    Posts
    21,654
    Print pre-view shows correct states in IE with any DTD.

    Do you have a css for print?

  5. #5
    Join Date
    Aug 2010
    Posts
    6
    Hi Fang,
    With the above simple test there is no css. Also css would not change if a checkbox would print different. The "real" form is having screen and print css-file but is not the issue here.
    Which IE version, language and OS are you testing in?

    I've Vista Eng 32 and 64 with IE8 (8.0.6001.18943).
    See attached my problem. First I click on the checkbox and radio, than print preview. Shows both unchecked again...

    Thanks,
    Michael
    Attached Images Attached Images
    Last edited by meikel1999; 08-29-2010 at 10:28 AM.

  6. #6
    Join Date
    Apr 2003
    Location
    Netherlands
    Posts
    21,654
    The same system, except in Dutch. No problem here.
    I'm sure there would be mention of this on the web if it were a system problem.
    Can we get a link?

  7. #7
    Join Date
    Aug 2006
    Posts
    1,934
    Michael, just so you don't think you've gone completely mad, I tested your code, and went back to an online form of my own, and I see the same issue you're having.

    I have no answer though...

    Dave

  8. #8
    Join Date
    Apr 2003
    Location
    Netherlands
    Posts
    21,654
    Finally found the issue: http://www.sitepoint.com/forums/showthread.php?t=663679
    and mentioned here: http://blogs.msdn.com/b/ie/archive/2...-thursday.aspx
    I do find it strange that I have no problem in any mode considering I have the same system as you, except for the language.

  9. #9
    Join Date
    Aug 2010
    Posts
    6
    So ... it seems to be a IE8 bug. D*mn. Just tested it in a Virtual PC with IE6 and that doesn't have a problem.
    Fang, thanks for the links. I'll try the suggestion from sitepoint, just hope I can use this header in the actual live site :-s
    I'm also curious if the language has anything to do with this. Sadly I don't have any Dutch systems here, but all website visitors using this form will be Dutch so most will have a Dutch system. Gives me some hope!

    Thanks!

  10. #10
    Join Date
    Aug 2010
    Posts
    6
    Just found that IE8 with "Compatibility view" turned ON, it is also printing checkboxes correctly.
    Fang, can you please check if you have this turned ON by default?

  11. #11
    Join Date
    Apr 2003
    Location
    Netherlands
    Posts
    21,654
    The document opens in:
    Browser mode: Compatibility view
    Document mode: Standard for IE7

  12. #12
    Join Date
    Aug 2010
    Posts
    6

    Lightbulb Final conclusion

    To wrap-up this thread, and for somebody who might find this page:

    Turns out to be a IE8 bug:
    http://webbugtrack.blogspot.com/2009...issues-in.html

    It's not having this problem with "Compatibility View" turned ON (that's you Fang).

    A solution is to add the following in the header:

    Code:
        <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
    Which kinda breaks validation and gives a problem when IE9 comes up.

    Other "nice" workaround with JavaScript works also:

    Code:
        <input type='checkbox' name='y' onclick='SetCheck(this)'/>
        .....
        
        function SetCheck(el)
        {
          if(el)
          {
            if(el.checked)  el.setAttribute('checked','checked');
            else            el.removeAttribute("checked");
          }
        }
    But when you cannot rely on javascript being turned on, you're screwed by Microsoft.
    Last edited by meikel1999; 08-31-2010 at 03:24 PM. Reason: added code formatting

  13. #13
    Join Date
    Sep 2010
    Location
    Melbourne, Australia - on loan from London, UK
    Posts
    56
    Just joined this forum especially to say thanks to all who contributed to this topic. I had exactly the same problem with IE8!

    Code:
    <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
    One final point about using the meta tag fix above: it works best if you place it in the head tag BEFORE any links to external CSS files.

    The first time I tried using the fix, I placed it at the end of my head tag - after a bunch of stylesheet links and it didn't work. Once I moved the meta tag to the top of my head tag area, it worked fine
    Thanks again!

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles