How to include a jquery function within a window.open

Question

In order for my print preview to 'accept' the styling, i need to include a function within my popup that i'm using to print:

The function i'm using to print is:

 $('#printPersonnel').click(function () {
            var data = document.getElementById('personnelTable').outerHTML;
            var mywindow = window.open('', data);
            mywindow.document.write('<html><head><title>NORA Loading</title>');
            mywindow.document.write('<link rel="stylesheet" type="text/css" href="http://localhost:49573/Content/Site.css">');
            mywindow.document.write('<link rel="stylesheet" type="text/css" href="http://localhost:49573/Scripts/examples-offline.css">');
            mywindow.document.write('<link rel="stylesheet" type="text/css" href="http://localhost:49573/Scripts/kendo.rtl.min.css">');
            mywindow.document.write('<link rel="stylesheet" type="text/css" href="http://localhost:49573/Scripts/kendo.common.min.css">');
            mywindow.document.write('<link rel="stylesheet" type="text/css" href="http://localhost:49573/Scripts/kendo.dataviz.default.min.css">');
            mywindow.document.write('<link rel="stylesheet" type="text/css" href="http://localhost:49573/Scripts/kendo.dataviz.min.css">');
            mywindow.document.write('<link rel="stylesheet" type="text/css" href="http://localhost:49573/Scripts/kendo.default.min.css">');

            mywindow.document.write('</head><body>');
            mywindow.document.write(data);
            mywindow.document.write('</body></html>');

            mywindow.document.close();
            mywindow.focus();
            mywindow.print();
            mywindow.close();
            return true;
        });

However, I need to include a $(document).ready function in order to add this formatting correctly (i'm using telerik UI grid).

This means that I would need to include script tags in my document.

My problem lies with trying to add a closing script tag (it sees itself as part of the parent page, instead of within the function).

Any suggestions as to how I could achieve this functionality?

I'm trying to print everything within a certain table tag, which is formatted on document ready to be viewed as a telerik grid on page load

Edit

My issue is with the closing tag of mywindow script:

 mywindow.document.write('});');
 mywindow.document.write('</script>'); //issue with this line/seen as esc sequence (i think)

enter image description here

Well, I am able to make`mywindow.document.write("");` work, may be problem lies inside `$.ready` function body, syntax error or something? — Zudwa, Dec 04 '14 at 12:57

score 1 · Accepted Answer · answered Dec 04 '14 at 13:17

1

You can use backslash with the end script tag.

mywindow.document.write("<script>(function(){alert('1');})();<\/script>");

answered Dec 04 '14 at 13:17

Athipatla

422
2
10

score 1 · Answer 2 · answered Dec 04 '14 at 13:19

1

You can split </script> into parts, so it won't be interpreted as a closing tag:

mywindow.document.write("<script>(function(){alert('1');})();" + "<" + "/script>");

answered Dec 04 '14 at 13:19

Zudwa

1,360
10
13

@A.Wolff you're right. Encoding `<` is even a better approach (IMHO). – Zudwa Dec 04 '14 at 13:37

How to include a jquery function within a window.open

2 Answers2