Member Avatar for pranav_jog

how to print html form directly.
i.e is there any programatic way or is there any tag to print html form

  • 5 Contributors
  • 8 Replies
  • 628 Views
  • 1 Year Discussion Span
  • Latest Post Latest Post by Sarahj512

Dani AI

Generated

Three practical routes exist for "printing an HTML form" and which one to choose depends on whether a print dialog is acceptable or the environment must print silently.

Client-side (typical): prepare a clean, print-only view and let the browser show the print dialog. Use a print stylesheet to hide navigation/buttons and style form data for paper. As suggested, posting values to a summary page is a simple way to produce a readable print layout; as noted, browsers expose a JS print call that opens the print dialog. To print the filled values rather than raw inputs, replace controls with plain text at print time (beforeprint) and restore them afterward:

// make controls render as plain text for printing, then restore
function makePrintable() {
  var els = document.querySelectorAll('input, textarea, select');
  els.forEach(function(el){
    var span = document.createElement('span');
    span.className = 'print-val';
    span.textContent = (el.type === 'checkbox' || el.type === 'radio') ? (el.checked ? 'Checked' : 'Not checked') : (el.value || '');
    el.style.display = 'none';
    el.parentNode.insertBefore(span, el.nextSibling);
  });
}
function restoreForm() {
  document.querySelectorAll('.print-val').forEach(function(s){
    var prev = s.previousElementSibling;
    if (prev) prev.style.display = '';
    s.parentNode.removeChild(s);
  });
}
window.addEventListener('beforeprint', makePrintable);
window.addEventListener('afterprint', restoreForm);

Simple print CSS helps a lot:

@media print {
  .no-print { display: none !important; }
  .print-val { color: #000; }
}

Silent / direct printing (no dialog) is not allowed in normal web pages for security reasons. It is only feasible in controlled setups: kiosk browsers or special flags/extensions, browser-managed devices, native apps, or by generating a server-side PDF and sending it to a printer from a server or print server. Testing across browsers and printers is essential; also account for page breaks, background printing settings, and how checkboxes/radios render on paper.

Recommended Answers

All 8 Replies

Member Avatar for sreein1986

I think it on dynamic page

Member Avatar for pranav_jog

but how to do it in programatic way??? is there any code to print the page???


I think it on dynamic page

Member Avatar for pranav_jog

but how to do it in programatic way??? is there any code to print the page???

I think it on dynamic page

Member Avatar for sreein1986

please the post this thread in ASP or ASP.net forum
They will Answer

Member Avatar for macneato

Hi Pranav,

I don't quite understand. Would you like the form to be printed onscreen?

If so (Im going to use php to do this) here is what we will do.

Simple HTML form:

<form id="form1" name="form1" method="post" action="mail.php">
  <p>Name 
    <input name="visitor" type="text" id="visitor" />
</p>
  <p>Email
    <input name="visitormail" type="text" id="visitormail" />
</p>
  <p>Message 
    <textarea name="notes"></textarea>
  </p>
</form>

Then comes the PHP

I'm going to explain it, then give you the complete code.

Alright so first we assign varibles.

<?php
$name = $_POST['visitor']; 
$email = $_POST['visitormail']; 
$msg = $_POST['notes'];
?>

Hope you see what I'm doing here, basically we giving our textareas/boxs names to be called by.

next we will want to print it onscreen. To Accomplish this. We will use the ECHO command, then call the varibles we assigned.

Read below:

<p align="center">
Thank You : <?php echo $name ?> ( <?php echo $email ?> ) 
<br /> 
Message:<br /> 
<?php $notesout = str_replace("\r", "<br/>", $notes); 
echo $notesout; ?> 
<br /><br />
<a href="index.html"> Home </a></p>

Notice we using Html? and only php to fill in the blanks.

Your complete code would look like this:

<?php
$name = $_POST['visitor']; 
$email = $_POST['visitormail']; 
$msg = $_POST['notes'];
?>
<p align="center">
Thank You : <?php echo $name ?> ( <?php echo $email ?> ) 
<br /> 
Message:<br /> 
<?php $notesout = str_replace("\r", "<br/>", $notes); 
echo $notesout; ?> 
<br /><br />
<a href="index.html"> Home </a></p>

Done! Remeber to name the php section of the code mail.php (if you following this tutorial, if not, just name it to anything you assigned your form action to)

If you need any more assistance, just ask.

Regards,

Member Avatar for pranav_jog

whenever user clicks the print button on html file, then the data in html will be printed, i'e it will directly go to printer for printing.
how to do this in html??

Member Avatar for Shanti C

Member Avatar for Sarahj512

how to print html form directly.
i.e is there any programatic way or is there any tag to print html form

I don't know if anyone still reads this, but I found a good article on www.htmlgoodies.com. I didn't copy the entire thing, but here's the URL to go directly to the page if you want to read it.
Print a Page Using JavaScript

The good thing about the command, the way the authors set it up, is that it does not immediately fire a print. It actually only fires the print window:

It's then up to the person who triggered the method whether to then continue with the print or not. That's good because I can see a ton of problems with printers not being turned on and huge, huge files being set to print.

And here's the code:

<A HREF="javascript:window.print()">Click to Print This Page</A>

The JavaScript is triggered by using the command "javascript:" in place of a URL, thus allowing a hypertext link to fire off the JavaScript.

And before you ask, yep, this will work with almost any JavaScript Event Handler as long as the format allows you to write it as a specific line or trigger a function.

You can set it to print off of an image:

<A HREF="javascript:window.print()">
<IMG SRC="print_image.gif" BORDER="0"</A>

You can set it to trigger off a button:

<FORM>
<INPUT TYPE="button" onClick="window.print()">
</FORM>

And, if you really want to be annoying, off of just about any Event Handler like this, adding onLoad will force a print request when the page loads:

onLoad="window.print()"
Edited by Ezzaral because: Added code tags. Please use them to format any code that you post.
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.