Asp Print button

Question

I have tried enough on print button code but no sake. These are my codes with images.

 <asp:Button ID="printButton"  style="margin-left: -0.3%;" runat="server" Text="Print Invoice" OnClientClick="javascript:window.print();" Font-Bold="True" Font-Size="14pt" Width="150px" Height="40px" BackColor="#CC0000" ForeColor="White" />

This gives me the following output.

The problem in this output image is that it prints all the page but it has damaged my design. Like if you can see, Header is showing code instead of images. Is this any way to modify it. e.g i only want here to print the circular logo and the grid-view only.

Another code i have used on button_click code behind is:

ClientScript.RegisterStartupScript(Page.GetType(), "vPrint", "window.print();", true);

it also doesn't works for me. As i used this code when i have design my own template, but when i'm applying this on downloaded templatel, it shows me an empty page on print button output. See here.

I also tried JavaScript function like window.Print() etc. But not working, Kindly sort out this for me. Thanks

This might help you - http://stackoverflow.com/questions/2255291/print-the-contents-of-a-div — SpruceMoose, Oct 29 '15 at 14:12
@hamza alternative is keep another page and on button click try to navigate to that page and call only the print code — Krsna Kishore, Oct 29 '15 at 15:09
@HamzaJaved what content you want to post in another page just try to put it in one single method and use that method to print in another page — Krsna Kishore, Oct 29 '15 at 16:22

score 1 · Accepted Answer · answered Oct 29 '15 at 13:30

1

Why use an ASP button control at all? Just use a standard html one:

<style type="text/css">
    #btnPrint
    {
        margin-left: -0.3%;
        width : 150px;
        height: 40px;
        background-color: #CC0000;
        color: #FFFFFF;
        font-size: 14pt;
    }
</style>
<input id="btnPrint" name="btnPrint" type="button" value="Print Invoice" onclick="window.print()"/>

answered Oct 29 '15 at 13:30

David P

2,027
3
15
27

same result like my first image – Hamza Javed Oct 29 '15 at 13:38
Sorry - I can't see your images. Blocked by Corporate proxy server. Can you create a JS Fiddle? Also, if you only want to print certain DOM elements, you probably want to add @media print styles to stylesheet, where you would set display: none; to all elements you don't want to print. – David P Oct 29 '15 at 13:45
I have not any idea of JS Fiddle – Hamza Javed Oct 29 '15 at 13:50
:( -------------------------- – Hamza Javed Oct 29 '15 at 13:50
Just go to: https://jsfiddle.net/, add your code, and then put a hyperlink to it in your question. – David P Oct 29 '15 at 14:06
jsfiddle.net got it but i do'nt even know now what to do now – Hamza Javed Oct 29 '15 at 14:09
I guess follow the instructions on the website or search for help on how to use it. That's kinds of outside the scope of the question. BTW - have you tried adding CSS media query? – David P Oct 29 '15 at 14:17
Sir, i used media print, and my problem solved, as you suggested. Thanks – Hamza Javed Oct 29 '15 at 18:10

Asp Print button

1 Answers1