Giter VIP home page Giter VIP logo

Comments (19)

charles4221 avatar charles4221 commented on July 19, 2024 2

@MatthewHerbst @aviklai wow, you guys work fast! Thank you so much for looking into this so quickly. I'll be able to update and re-test on Monday morning and I'll report back!

from react-to-print.

dsbhakta avatar dsbhakta commented on July 19, 2024

Yes very good finding. I thought i was doing something wrong. good examples.

from react-to-print.

ktulchinsky avatar ktulchinsky commented on July 19, 2024

Super awesome, it should support checbox checked print

from react-to-print.

purevsurenm avatar purevsurenm commented on July 19, 2024

I also see this issue. Not sure why. It is confusing when you fill up a form and print it, but the checkboxes you checked are unchecked.

from react-to-print.

MatthewHerbst avatar MatthewHerbst commented on July 19, 2024

This is a very strange bug. Does anyone know of any other circumstances where similar behavior is seen? I'm trying to narrow down where I should be looking to solve this. Thanks for the reports!

from react-to-print.

valeriozhang avatar valeriozhang commented on July 19, 2024

Any news on the this? Experiencing the same issue - only display checkboxes that have defaultValues

from react-to-print.

MatthewHerbst avatar MatthewHerbst commented on July 19, 2024

@valeriozhang I've not been able to make any progress on this. My guess is it's something arcane. Do you have any ideas?

from react-to-print.

kapilgundawar avatar kapilgundawar commented on July 19, 2024

Hi Team,
iam also facing checkbox issue the moment i click on print,All my checked are removed.
Can someone please help in this

from react-to-print.

valeriozhang avatar valeriozhang commented on July 19, 2024

@MatthewHerbst No sorry - haven't looked through the source. I just used CSS to modify my browser prints.

from react-to-print.

MatthewHerbst avatar MatthewHerbst commented on July 19, 2024

@valeriozhang what CSS did you add?

from react-to-print.

valeriozhang avatar valeriozhang commented on July 19, 2024

I didnt use the package.

@media print {
    body * {
      visibility: hidden;
    }
  
    #section-to-print, #section-to-print * {
      visibility: visible;
    }
  
    #section-to-print {
      /* position: absolute;
      left: 0;
      top: 0;
      bottom: 200 */
    }
    
}

from react-to-print.

ibanjb avatar ibanjb commented on July 19, 2024

In my current project, I'm using the pro.ant.design scaffolder and I found the same problem with the radio and check buttons, they are not well printed. Recently, I opened another issue in the ant-design repo ant-design/ant-design#15980 and this is their response about that:

Seems it's bug of browser. We can do nothing about this. Close this as won't fix.
Please feel free if you have any idea to fix this

from react-to-print.

aviklai avatar aviklai commented on July 19, 2024

Hi,

This works as it should but the react and react-dom versions have to be both 16.5 or above.
Looks like it was caused by a bug in react:
facebook/react#13114

Here is a working example:
https://codesandbox.io/s/6xlqn5m7nr

@MatthewHerbst FYI

from react-to-print.

MatthewHerbst avatar MatthewHerbst commented on July 19, 2024

Thanks @aviklai for finding that! I have been scratching my head on this one for months

from react-to-print.

charles4221 avatar charles4221 commented on July 19, 2024

@MatthewHerbst @aviklai unfortunately this isn't completely resolved. I still have this issue on React & ReactDOM 16.14.
I opened up @aviklai's CodePen example above and edited it to have the checked value controlled by React state, as is the case for most React-driven forms in most applications, and then you can see the issue again where checked checkboxes are appearing unchecked in the print window.

from react-to-print.

aviklai avatar aviklai commented on July 19, 2024

@charles4221 Hi, can you share the edited codesandbox?
I created an example where the checkbox is controlled by the state and it looks o.k.
https://codesandbox.io/s/react-to-print-forked-7smdp

from react-to-print.

MatthewHerbst avatar MatthewHerbst commented on July 19, 2024

I am able to replicate. @aviklai in your example above, add an onClick to the checkbox to toggle the state. Toggle it to unchecked. Then try and print, and the print preview window still shows it as checked. Very strange

from react-to-print.

aviklai avatar aviklai commented on July 19, 2024

@MatthewHerbst - I think the above PR should fix the issue.

from react-to-print.

MatthewHerbst avatar MatthewHerbst commented on July 19, 2024

Published as v2.10.2, thanks ๐ŸŽ‰

from react-to-print.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.