Question

Dennis J Olson on Thu, 26 Sep 2013 19:46:41


I have an application with two Divs. One Div is visible if the user has Admin capability, and a different one is visible if the user does not.

In the first Div is an Editor control. Text data is pulled from the database and loaded into the editor text-entry area. In the second Div is a simple Label control which receives that same data.

I have been tasked with adding a PRINT button such that when clicked, a printer dialog opens, and when they click Print in that dialog box (after potentially selecting a different printer), the data in whichever control/Div is visible needs to be sent to the printer.

I may NOT open up another app such as Notepad or Word. I have to send the data directly from the control. I am very new to C#, and don't have a clue how to do this. (However, I have many years in VB.)  There is a separate PRINT button for each Div, but they both use the same OnClick event code.

Any insight into this would be hugely appreciated.

Thanks!


Sponsored



Replies

tnw on Thu, 26 Sep 2013 19:52:25


Please take a look at this resource about printing. It should get you started.

Caillen on Fri, 27 Sep 2013 07:45:22


Hi Dennis,

Please check this thread:

ASP.NET - Print Only the Content Inside of Div

The third solution using JQuery to print in this link seems to be good for you.

In another thread, similar solution is given:

Printing DIV Contents using Print Preview

Also an example from code project here:

Print Div Content Using JavaScript

I hope it helps.

Dennis J Olson on Fri, 27 Sep 2013 21:06:16


Okay, I've read up on all this and learned a lot in the past few days. I learned that (of course) nothing can be done from the cs code (server side). It all has to happen in javascript on the client side.

That being said, I have a different issue now. the text I need to print is the .defaultValue of a hidden control on the web page. there is no DIV in which this code resides, so there is nothing in any innerHTML attribute for me to harvest.

Now, the data that's in the control will have HTML embedded in it, as it will be a "page" of text. But being in the defalutValue of the control, when I fetch that data and place it onto my temporary HTML page for printing, the markup shows as TEXT. It doesn't actually render when dropped onto the in-progress page.

Does anyone know how I can force the markup to render? If I can do that, I will have successfully completed this task.

Thanks!

Caillen on Mon, 07 Oct 2013 05:14:24


Assuming your hidden control's id is Hidden_ID, use document.write method to write the html content to the new page to print:

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script type="text/javascript">
        
        function print()
        {
            var disp_setting = "toolbar=yes,location=no,directories=yes,menubar=yes,scrollbars=yes,width=780, height=780, left=100, top=25";
            var docprint = window.open("about:blank", "_blank", disp_setting);
            var oHidden = document.getElementById("Hidden_ID");
            docprint.document.open();
            docprint.document.write('<html><head><title>Content to print.</title>');
            docprint.document.write('</head><body><center>');
            docprint.document.write(oHidden.defaultValue);
            docprint.document.write('</center></body></html>');
            docprint.document.close();
            docprint.print();
            docprint.close();
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <input type="hidden" id="Hidden_ID" value="<table><tr><td>this is title</td></tr><tr><td>this is content</td></tr></table>" />
        <input type="button" value="click me to print" onclick="print();" />
    </form>
</body>
</html>