My favorites | Sign in
Project Home Downloads Issues
READ-ONLY: This project has been archived. For more information see this post.
Search
for
  Advanced search   Search tips   Subscriptions
Issue 345: Printing issue
2 people starred this issue and may be notified of changes. Back to list
Status:  Fixed
Owner:  ----
Closed:  Oct 2009


 
Reported by dean...@gmail.com, Oct 1, 2009
What steps will reproduce the problem?
1. I've created a modal window with the following settings:
minWidth: 960,
minHeight: 500,
height: 500,
width: 960,
modal: false,
bgColor: '#000000',
resizable: false,
padding: 20});
2. The content of the window creates a vertical scroll bar
3. I've placed a link that calls javascript's window.print

What is the expected output? What do you see instead?
It only prints the visible section of the window, not anything that you'd 
see if scrolling down on the modal

What version of the product are you using? On what operating system?
1.5.2, windows, using IE, Firefox, and Safari, same results

Please provide any additional information below.


Oct 3, 2009
Project Member #1 nyro...@gmail.com
To setup the way the print works, you have to write a new CSS especially for print.
In this CSS, you'll basically hide everything and show the #nyroModalWrapper div.

The very specific problem you're pointing out is because of the overflow value, set
to auto in the nyroModal settings css.content.

Maybe you could change it everytime, but i'm not sure the result will be great.

What you can do might be:
- Set the overflow settings to nothing
($.nyroModalSettings({css:{content:{overflow:''}}});
- Add #nyroModalContent {overflow: 'auto'} in your normal CSS
- Add #nyroModalContent {overflow: 'visible'} to your print CSS

In the next release, this settings will not exists here by default. Instead, it'll be
added in the CSS, which means the step 1 and 2 won't be needed anymore to do what you
want.
Status: Fixed
Nov 8, 2009
Project Member #2 nyro...@gmail.com
The version 1.5.4 is now here and made the changes described in my last comment.
Nov 12, 2009
#3 dean...@gmail.com
Hello, thanks for the help.  I'm still having this issue though.  I tried both of 
your solutios (pre 1.5.4 and 1.5.5) and neither yielded the correct result. I'm 
pasting the page below:  Also attaching the resulting printout based on 1.5.5 which 
actually worked out worse than the original method using 1.5.2

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 
Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>blah</title>
    <link rel="stylesheet" href="styles/style.css" type="text/css" />
    <link rel="stylesheet" href="styles/nyroModal.css" type="text/css" 
media="screen" />
	<script type="text/javascript" src="scripts/jquery-1.3.2.min.js"></script>
	<script type="text/javascript" src="scripts/jquery.nyroModal-
1.5.5.pack.js"></script>
	<style media="print" type="text/css">
	    body {background: white;}
	    #nyroModalContent { overflow: visible; }
	</style>
</head>
<body style="background-color: #ffffff;">
    <form id="form1" runat="server">
        <script type="text/javascript">
        $(function(){
	        $.nyroModalSettings({
	            minWidth: 890,
	            minHeight: 500,
	            height: 500,
	            width: 890,
	            modal: false,
	            bgColor: '#000000',
	            resizable: false,
	            padding: 5});
        });
        </script>
        <div style="width: 900px; text-align: left; margin-left:3px; color: #212121; 
position: relative;">
            <div style="position: absolute; top: 20px; right: 40px;">
                <a href="blah.aspx" class="nyroModal">blah</a>
            </div>
            <div style="position: absolute; top: 40px; right: 40px;">
                <a href="javascript:window.print();" title="Click here to 
print">Print</a>
            </div>
            <br />
            <img src="images/logo.jpg" alt="blah" />
            <br />
            <br />
            <h2>blah</h2>
            <br />
            <h3>Ultrasound Guided Biopsy</h3>
            <table cellpadding="0" cellspacing="0" border="1" width="96%" 
style="text-align: center; text-transform: uppercase; border-style:solid; border-
width: thick; border-color: #000000;">
                <tr>
                    <td style="width: 200px;">Compatible With</td>
                    <td>blah</td>
                </tr>
                <tr>
                    <td rowspan="4">blah</td>
                    <td>blah</td>
                </tr>
            </table>
            <br />
            <br />
            
            <h3>blah</h3>
            <table cellpadding="0" cellspacing="0" border="1" width="96%" 
style="text-align: center; text-transform: uppercase; border-style:solid; border-
width: thick; border-color: #000000;">
                <tr>
                    <td style="width: 200px;">Compatible With</td>
                    <td>blah</td>
                </tr>
                <tr>
                    <td rowspan="4">blah</td>
                    <td>blah</td>
                </tr>
            </table>
            <br />
            <br />
            
            <h3>blah</h3>
            <table cellpadding="0" cellspacing="0" border="1" width="96%" 
style="text-align: center; text-transform: uppercase; border-style:solid; border-
width: thick; border-color: #000000;">
                <tr>
                    <td style="width: 200px;">Compatible With</td>
                    <td>blah</td>
                </tr>
                <tr>
                    <td rowspan="4">blah</td>
                    <td>blah</td>
                </tr>
            </table>
            <br />
            <br />
            
            <h3>blah</h3>
            <table cellpadding="0" cellspacing="0" border="1" width="96%" 
style="text-align: center; text-transform: uppercase; border-style:solid; border-
width: thick; border-color: #000000;">
                <tr>
                    <td style="width: 200px;">Compatible With</td>
                    <td>blah</td>
                </tr>
                <tr>
                    <td rowspan="4">blah</td>
                    <td>blah</td>
                </tr>
            </table>
            <br />
            <br />
            
            <h3>blah</h3>
            <table cellpadding="0" cellspacing="0" border="1" width="96%" 
style="text-align: center; text-transform: uppercase; border-style:solid; border-
width: thick; border-color: #000000;">
                <tr>
                    <td style="width: 200px;">blah</td>
                    <td>blah</td>
                </tr>
                <tr>
                    <td rowspan="4">blah</td>
                    <td>blah</td>
                </tr>
            </table>
            <br />
            <br />
        </div>
    </form>
    
    
</body>
</html>

test.pdf
76.5 KB   Download
Nov 13, 2009
Project Member #4 nyro...@gmail.com
I don't see any problem with your atteched pdf.
Maybe you could also hide the close button, and other unneeded links.

Powered by Google Project Hosting