Unable to print div's content using Javascript

Question

I'm trying to print the content of a div when the "Print" button is clicked. I keep getting this error: "Unable to set value of the property 'innerHTML': object is null or undefined." I read some posts over the Internet but I still can't find a working solution.

Here is my javascript code I use to print (got from here):

<script type="text/javascript">
    function printDiv(divName) {
        var printContents = document.getElementById(divName).innerHTML;
        var originalContents = document.body.innerHTML;

        document.body.innerHTML = printContents;

        window.print();

        document.body.innerHTML = originalContents;
    }
</script>

My button event raises here:

<asp:Button ID="ButtonPrint" runat="server" Text="Print »" OnClientClick="printDiv('content');return false"></asp:Button>

And this is the div I'm supposed to print:

 <div id="content" runat="server">
    <h1 class="title" runat="server" id="formulario"></h1>
    <asp:Table ID="TableForm" runat="server"></asp:Table>
    <div id="TableQuest" runat="server">
    </div>
    <asp:Table ID="TableText" runat="server"></asp:Table>
   <asp:Label ID="LabelInfo" runat="server" Text=""></asp:Label>
</div>

Any help would be greatly appreciated!

This line: var printContents = document.getElementById(divName).innerHTML; — Sarah, Apr 16 '15 at 13:28
Ehm sorry..I don't know how to use it..besides..I print the data inside the div from code behind..I don't know how to make it works.. — Sarah, Apr 16 '15 at 13:37
Can you show the source of the generated HTML and check that it still has an id of 'content'? — Evan Knowles, Apr 16 '15 at 13:38
I checked..the name has changed in "
", I think it's because I'm using masterpage and content pages, isn't it? Do I have to use the generated ID in order to make it work? — Sarah, Apr 16 '15 at 13:40

score 1 · Accepted Answer · edited May 23 '17 at 12:28

1

Thanks to @Evan Knowles I finally found a solution.

I'm actually using a MasterPage and Content Pages, so my id's name 'content' is automatically changed in 'ContentPlaceHolder1_content'.

If the method is called using the new generated id: <asp:Button ID="ButtonStampa" runat="server" Text="Stampa »" OnClientClick="printDiv('ContentPlaceHolder1_content');return false"></asp:Button> everything works just fine!

edited May 23 '17 at 12:28

Community

1
1

answered Apr 16 '15 at 13:51

Sarah

65
1
12

Good job! You may have more luck in future selecting on classes rather than IDs. – Evan Knowles Apr 17 '15 at 06:59

score 0 · Answer 2 · edited Apr 16 '15 at 13:41

0

You should use - <%=content.ClientID()%>

your Div is server side so you will not get this div as you mention in your question. You have to use .ClientID as below code.

document.getElementById('<%=content.ClientID %>').innerHTML

edited Apr 16 '15 at 13:41

SWa

4,343
23
40

answered Apr 16 '15 at 13:29

prog1011

3,425
3
30
57

If I do, I get his error: "The name 'content' does not exist in the current context." Might it be because I'm using a master page (where the javascript code is) and I call the method from a content page? – Sarah Apr 16 '15 at 13:31

Unable to print div's content using Javascript

2 Answers2