SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Member
    Join Date
    Mar 2004
    Location
    walnut creek, ca
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Allow printing of single table cells

    Hello-

    I'd like to be able to place inside any given table cell a link or button that will print only the contents of that single cell.

    I tried some code that print between <div> and </div> but it printed the entire webpage instead of just the one cell.

    Can anyone please help me to get this right?

    Thank you!

    Jay

  2. #2
    ☆★☆★ silver trophy vgarcia's Avatar
    Join Date
    Jan 2002
    Location
    in transition
    Posts
    21,235
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    Why not open a new window, copy the content of the cell from the main page to the new window, and print that?

  3. #3
    SitePoint Member
    Join Date
    Mar 2004
    Location
    walnut creek, ca
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    because...

    Quote Originally Posted by vgarcia
    Why not open a new window, copy the content of the cell from the main page to the new window, and print that?
    I need the action/solution to be absolutely brainless and foolproof for my users........trust me the need the button...

  4. #4
    ☆★☆★ silver trophy vgarcia's Avatar
    Join Date
    Jan 2002
    Location
    in transition
    Posts
    21,235
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    I'm saying to do all that programmatically, then have the function execute when the user clicks a button.

  5. #5
    SitePoint Wizard silver trophy
    Join Date
    May 2003
    Posts
    1,843
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    This is pretty messy...you'd 'disappear' the iframe in practice, probably positioning it absolutely, offscreen (top:-2000px). Didn't have time to test.
    Code:
    
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" 
        "http://www.w3.org/TR/html4/loose.dtd">
    
    <html>
    <head>
    <title>untitled</title>
    <style type="text/css">
    
    #dummyprint {
    	float: right;
    	margin-right: 20%;
    }
    table {
    	width: 200px;
    }
    td {
    	width: 50%;
    	font: 12px verdana;
    	text-align: center;
    	padding: 3px;
    	border: 3px silver double;
    	cursor: pointer;
    }
    
    </style>
    <script type="text/javascript">
    
    var sHTML = '';
    
    onload = function()
    {
    	var table, cells, cell, i = 0;
    	table = document.getElementsByTagName('TABLE').item(0);
    	cells = table.getElementsByTagName('TD');
    	while (cell = cells.item(i++))
    	{
    		cell.onclick = function() 
    		{
    			var sCSS = 'font:12px verdana;padding:3px;text-align:center;border:1px silver dashed;';
    			sHTML = '';
    			sHTML += '<html><head><title>| cell |</title></head>';
    			sHTML += '<body style="margin:0;padding:0;overflow:hidden;" ';
    			sHTML += 'onload="print()">';
    			sHTML += '<div style="' + sCSS + '">';
    			sHTML += this.innerHTML;
    			sHTML += '</div></body></html>';
    			var dummyprint = document.getElementById('dummyprint');
    			dummyprint.src = 'javascript&#58;parent.sHTML';
    			dummyprint.style.width = this.offsetWidth;
    			dummyprint.style.height = this.offsetHeight;
    			this.style.background = 'buttonface'; //OK, only kidding
    		}
    		cell.title = 'click to print cell';
    	}
    }
    
    
    </script>
    </head>
    <body>
    <table>
    <tr>
    <td>stuff 1 stuff 1 stuff 1 stuff 1 stuff 1 stuff 1 stuff 1 stuff 1 stuff 1 stuff 1 stuff 1 stuff 1 stuff 1 stuff 1 </td>
    <td>stuff 2 stuff 2 stuff 2 stuff 2 stuff 2 stuff 2 stuff 2 stuff 2 stuff 2 stuff 2 stuff 2 stuff 2 stuff 2 stuff 2 </td>
    </tr><tr>
    <td>stuff 3 stuff 3 stuff 3 stuff 3 stuff 3 stuff 3 stuff 3 stuff 3 stuff 3 stuff 3 stuff 3 stuff 3 stuff 3 stuff 3 </td>
    <td>stuff 4 stuff 4 stuff 4 stuff 4 stuff 4 stuff 4 stuff 4 stuff 4 stuff 4 stuff 4 stuff 4 stuff 4 stuff 4 stuff 4 </td>
    </tr>
    </table>
    <iframe id="dummyprint" name="dummyprint" frameborder="0" scrolling="0" src="about&#58;blank"></iframe>
    </body>
    </html>
    
    Last edited by adios; Mar 18, 2004 at 23:41.
    ::: certified wild guess :::


Bookmarks

Posting Permissions

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