Advanced Search

Results 1 to 5 of 5

Thread: Print with Javascript and CSS problem?

  1. #1
    Join Date
    Mar 2007
    Posts
    17
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Print with Javascript and CSS problem?

    Hi all.
    I have a button function to printe a dynamic generated page.
    Code is below. But the css section in the code seems not work.
    Could someone help me to debug it? Thanks.

    function sheetprint(){
    var aname = document.getElementById('name').value;
    var asex = document.getElementById('sex').value;
    str='';
    str=str + '<style type="text/css" media="print"> ';
    str=str + ' table td{ ';
    str=str + ' border: 1px solid red; ';
    str=str + ' } ';
    str=str + '</style> ';

    str=str + '<table> ';
    str=str + ' <tr><td colspan="4">Company</td></tr>';
    str=str + ' <tr><td colspan="4">Note</td></tr> ';
    str=str + ' <tr> ';
    str=str + ' <td>Name:</td> ';
    str=str + ' <td>'+aname+'</td> ';
    str=str + ' <td>Sex</td> ';
    str=str + ' <td>'+asex+'</td> ';
    str=str + ' </tr> ';
    str=str + '</table> ';
    document.body.innerHTML = str;
    window.print();
    window.history.go(0);
    }
    Last edited by writeman; 03-30-2007 at 01:17 PM.

  2. #2
    Join Date
    Jul 2006
    Location
    Canada
    Posts
    2,581
    Thanks
    13
    Thanked 28 Times in 28 Posts

    Default

    Code:
    function sheetprint(){
    var aname = document.getElementById('name').value;
    var asex = document.getElementById('sex').value;
    str="'';
    str=str + '<style type="text/css" media="print"> ';
    str=str + ' table td{ ';
    str=str + ' border: 1px solid red; ';
    str=str + ' } ';
    str=str + '</style> ';
    str=str + '<table> ';
    str=str + ' <tr><td colspan="4">Company</td></tr>';
    str=str + ' <tr><td colspan="4">Note</td></tr> ';
    str=str + ' <tr> ';
    str=str + ' <td>Name:</td> ';
    str=str + ' <td>'+aname+'</td> ';
    str=str + ' <td>Sex</td> ';
    str=str + ' <td>'+asex+'</td> ';
    str=str + ' </tr> ';
    str=str + '</table> ';
    document.body.innerHTML = str; ';
    window.print();
    window.history.go(0);
    }
    You only had one " in the variable. Makes it open, so you have to use "" to close it.
    - Mike

  3. #3
    Join Date
    Mar 2007
    Posts
    17
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    It seems have no matter with that. I wonder wheather I can use css in this way.

  4. #4
    Join Date
    Jul 2006
    Location
    Canada
    Posts
    2,581
    Thanks
    13
    Thanked 28 Times in 28 Posts

    Default

    Did you use an event handler to call "sheetprint"?
    Also, I cleaned up the code a bit, as it was invalid.
    Code:
    function sheetprint(){
    var aname = document.getElementById('name').value;
    var asex = document.getElementById('sex').value;
    var str='';
    str=str + '<style type="text/css" media="print"> ';
    str=str + ' table td{ ';
    str=str + ' border: 1px solid red; ';
    str=str + ' } ';
    str=str + '</style> ';
    str=str + '<table> ';
    str=str + ' <tr><td colspan="4">Company</td></tr>';
    str=str + ' <tr><td colspan="4">Note</td></tr> ';
    str=str + ' <tr> ';
    str=str + ' <td>Name:</td> ';
    str=str + ' <td>'+aname+'</td> ';
    str=str + ' <td>Sex</td> ';
    str=str + ' <td>'+asex+'</td> ';
    str=str + ' </tr> ';
    str=str + '</table> ';
    document.body.innerHTML = str;
    window.print();
    window.history.go(0);
    }
    - Mike

  5. #5
    Join Date
    Mar 2007
    Posts
    17
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    hi
    I call the function this way.

    <script type="text/javascript">
    function sheetprint(){
    var aname = 10;
    var asex = '男';
    var str='';
    str=str + '<style type="text/css" media="print"> ';
    str=str + ' table td{ ';
    str=str + ' border: 1px solid red; ';
    str=str + ' } ';
    str=str + '</style> ';
    str=str + '<table> ';
    str=str + ' <tr><td colspan="4">Company</td></tr>';
    str=str + ' <tr><td colspan="4">Note</td></tr> ';
    str=str + ' <tr> ';
    str=str + ' <td>Name:</td> ';
    str=str + ' <td>'+aname+'</td> ';
    str=str + ' <td>Sex</td> ';
    str=str + ' <td>'+asex+'</td> ';
    str=str + ' </tr> ';
    str=str + '</table> ';
    document.body.innerHTML = str;
    window.print();
    window.history.go(0);
    }
    </script>

    <input type="button" onclick="javascript:sheetprint();" value="print a sheet">

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
  •