Print contents of HTML form
i have a standard html form with some php inserts but i want to have a text link that will print just the text in the text boxes. so what i want to do is open another window and in that other window i will have some tables that will format the data where i need it so i will get the data with $_POST on that page but i dont know have to structure the print link in the original page. below is my html form
Code:
<form action="SavedTicket.php" name="new1" target="_self" method="post" onSubmit="return checkbae()">
<table width="25%" align="center">
<tr>
<!-- Row 1 Column 1 -->
<td><span class="style14"></span>
<input name="TicketNumber" type="hidden" id="TicketNumber" value="<?php echo $TicketNumber; ?>" maxlength="30" /> </td>
</tr>
<tr>
<!-- Row 1 Column 1 -->
<td><span class="style14"><b>Record #: <?php echo $TicketNumber; ?></b></span></td>
</tr>
<tr>
<!-- Row 1 Column 1 -->
<td><span class="style14"><b><?php echo $UnitChangedTo; ?>:</b></span><br />
<input name="unitnumber" type="text" id="unitnumber" value="<?php echo $unitnumber; ?>" maxlength="30" /> </td>
</tr>
<tr>
<!-- Row 1 Column 1 -->
<td><span class="style14">Call-In Date:</span><br />
<script>DateInput('callindate', true, 'YYYY-MM-DD', '<?php echo $callindate; ?>')</script>
</td>
</tr>
<tr>
<!-- Row 1 Column 1 -->
<td><span class="style14"><b>Completed Date:</b></span><br />
<?php if($completeddate == "0000-00-00"): ?>
<script>DateInput('completeddate', false, 'YYYY-MM-DD')</script>
<?php else: ?>
<script>DateInput('completeddate', false, 'YYYY-MM-DD', '<?php echo $completeddate; ?>' )</script>
<?php endif; ?>
</td>
</tr>
<tr>
<!-- Row 2 Column 1 -->
<td><span class="style14"><b><?php echo $namedchangedto; ?>:</b></span><br />
<input name="customername" type="text" id="customername" value="<?php echo $customername; ?>" maxlength="30" /> </td>
</tr>
<tr>
<!-- Row 3 Column 1 -->
<td><span class="style14"><b><?php echo $phonechangedto; ?>:</b></span><br />
<input name="phone" type="text" id="phone" value="<?php echo $phone; ?>" maxlength="30" /> </td>
</tr>
<tr>
<!-- Row 3 Column 1 -->
<td><span class="style14"><b>Email When Ticket is Completed & Closed:</b></span><br />
<input name="emailwhendone" type="text" id="emailwhendone" value="<?php echo $emailwhendone; ?>" size="40" maxlength="100" /></td>
</tr>
<tr>
<!-- Row 3 Column 1 -->
<td><span class="style14"><b>Assigned To:</b></span><br />
<input name="assignedto" type="text" id="assignedto" value="<?php echo $assignedto; ?>" size="40" maxlength="40" /></td>
</tr>
<tr>
<!-- Row 3 Column 1 -->
<td><span class="style14"><b>Address:</b></span><br />
<input name="address" type="text" id="address" value="<?php echo $address; ?>" size="35" maxlength="120" />
<img src="images/garmin.jpg" alt="Click here to open a Google map of the entered address" name="imageID" width="24" height="24" id="imageID"></td>
</tr>
<tr>
<!-- Row 4 Column 1 -->
<td><span class="style14"><b>Work to be Completed:</b></span><br />
<textarea name="worktobedone" cols="40" rows="6" id="worktobedone"><?php echo $worktobedone; ?></textarea></td>
</tr>
<tr>
<!-- Row 4 Column 1 -->
<td><span class="style14"><b>Work Completed:</b></span><br />
<textarea name="workcompleted" cols="40" rows="6" id="workcompleted"><?php echo $workcompleted; ?></textarea></td>
</tr>
<tr>
<!-- Row 5 Column 1 -->
<td><div align="center">
<input name="Save" type="Submit" value="Save" />
</div></td>
</tr>
</table>
</form>
Re: Print contents of HTML form
so.. you want to have a link to open a new window and just put the stuff in the text boxes into the new page? JavaScript sounds like it might be a better option for doing this. you can keep your form the way it is and just add a link that has an onclick event that creates a new window. then, just grab the textbox content from the parent window. Samba could probably help you more with something like that.
Re: Print contents of HTML form
Here's a simplistic example of something you could use:
Code:
<script type="text/javascript">
function popup(){
//create new window:
var printwindow = window.open('','name','height=400,width=500');
//write content to new window
printwindow.document.write(document.getElementById("textbox").value);
//close the content
printwindow.document.close();
//prompt user to print
printwindow.print();
}
</script>
<a href="#" onclick="popup();return false;">Click Here</a>
If you have a textarea with an id of "textbox", then clicking on the link should pop up a new window with whatever's in the textarea on the new page. You can expand upon this by adding more printwindow.document.write() lines:
Code:
<script type="text/javascript">
function popup(){
var printwindow = window.open('','name','height=400,width=500');
printwindow.document.write('<table><tr><td>');
printwindow.document.write(document.getElementById("textbox").value);
printwindow.document.write('</td></tr></table>');
printwindow.document.close();
printwindow.print();
}
</script>
<a href="#" onclick="popup();return false;">Click Here</a>
Or you could use DOM element creation methods on printwindow.document - whichever's more comfortable for you.
Or, if you've already got a page with your desired print layout created, and you need to insert text from the parent page, you could do something like this:
Code:
<script type="text/javascript">
function popup(){
var printwindow = window.open('/path/to/page.html','name','height=400,width=500');
printwindow.document.getElementById("targetElement").innerHTML = document.getElementById("textbox").value;
printwindow.document.close();
printwindow.print();
}
</script>
<a href="#" onclick="popup();return false;">Click Here</a>
This would require that you have a textarea with id "textbox" on the parent page, and an element with id "targetElement" on page.html. A new window will pop up with page.html in it, and "targetElement" will have the text of "textbox" in it.
Note - I haven't really browser-tested all of this yet, so apologies if anything doesn't actually work so far!
