Remove url and print text from printed page

I have developed a web application and there are some data displays on my web page with common headers, footers, menus and other images. so I added a small button as a printout so that the user can see the data. After the user clicks on the print preview button, only the data is displayed as a pop-up window, and in this pop-up window I added a button call print so that the user can click on it and print this page.

this print button directly calls window.print () in the onClick event and works fine, I can get printouts.

but my problem is on my printed page, on top of which I can find the text "Print", which is the label of the button and above, I can find the url something http://localhost/..............

So, there is a way to remove these printed texts and URLs from my printed page.

Many thanks

this is what the print preview button does. A.

 function printPreView(reportCategory,reportType,transactionType,searchOption,customerRokaID,utilityCompany,fromDate,toDate,telcoName,bank){ var request = "selectedMenu="+reportCategory+"&loginStatus=success&criteria="+searchOption+"&customer="+customerRokaID+"&from="+fromDate+"&to="+toDate+"&nspTypes="+utilityCompany+"&trxTypes="+transactionType+"&options="+reportType+"&telcoTypes="+telcoName+"&bankTypes="+bank+"&printable=yes"; window.open ("report/showReport.action?"+request,null,"location=no,menubar=0,resizable=1,scrollbars=1,width=600,height=700"); } 

This is how I put my print button

  <form> <input type="button" value="Print" onClick="window.print() "> </form> 
+7
source share
4 answers

The title with the URL (and sometimes the title of the page, page number, etc.) is automatically added by the web browser. Basically, the settings can only be changed by the user. This question is discussed in detail in this question.

For the button itself, you can hide it using special CSS for printing, as discussed in this question . And, as MMacdonald said, you can use this technique for other elements, so you don’t have to redisplay your page. But then you lose the preview function (the user can still use the browser preview function).

+8
source

If you are using bootstrap, find the following code:

  @media print { ... a[href]:after { content: " (" attr(href) ")"; } ... } 

Redefining style with content: none of them cope with the situation.

Link: This URL

+3
source

Consider using media-dependent style sheets instead of making a custom print page.

+1
source

It worked for me with a margin of about 1 cm

 @page { size: auto; /* auto is the initial value */ margin: 0mm; /* this affects the margin in the printer settings */ } html { background-color: #FFFFFF; margin: 0mm; /* this affects the margin on the html before sending to printer */ } body { padding:30px; /* margin you want for the content */ } 
0
source

All Articles