ansaurus

Question

Refactoring a function that uses window.open to use the DOM rather than write()

Answer 1

+1 A:

Why not use a library function such as http://plugins.jquery.com/project/modaldialog instead of reinventing the wheel?

[EDIT] OR

   function writePopup(){
      var popup = window.open("", "_blank", "height=400px, width=400px");
      var doc = popup.document;
      doc.title = 'Written Popup';

      var p = doc.createElement( 'p' );
      p.innerHTML = 'Testing Write';
      doc.body.appendChild(p);
   }

tvanfosson 2008-11-05 15:07:34

The users need to be able to print the contents of the popup, which rules out anything that uses a faux-popup, like that module.

Dan Monego 2008-11-05 15:21:13

you *could* use CSS to hide everything but the (div) popup when printing... a new window is probably easier, but it's still possible without.

nickf 2008-11-05 19:06:03

Answer 2

A:

Would it be possible to have another page that generates the dynamic content, and pop it open, passing arguments that identify the content you want generated, instead of trying to write to a new window?

Wes P 2008-11-05 15:08:56

Answer 3

+2 A:

Just doing quick tests, I can get doc to append DOM created HTML to my popup like so:

var popup = window.open("", "popup", "height=400px, width=400px"); 
var doc = popup.document.documentElement;
var p = document.createElement("p"); 
p.innerHTML = "blah"; 
doc.appendChild(p);

My example produces totally invalid HTML I know, but it works (with limited testing obviously).

Eric Wendelin 2008-11-05 15:38:54

Answer 4

+2 A:

One dump of .innerHTML should perform better than a zillion lines of document.write();

I would build up the DOM as needed and dump in using

doc.innerHTML = newDOM;

Still kind of hacky, but better than document.write();

scunliffe 2008-11-05 15:45:41

Answer 5

+1 A:

I've gone to using document.write() to generate the page.

I think you will probably have to use at least some document.write(), to put a skeleton page in place before you can interact with the DOM:

doc.write('<!DOCTYPE ...><html><head></head><body></body></html>');
doc.close();
doc.body.appendChild(...);

Before write() has been called, a new window's document is in an indeterminate state, there is no document yet to interact with. Firefox at least puts a temporary skeleton document in until you first call document.write(), but I can't see that this is actually documented anywhere so it's probably best not relied upon.

var popup = window.open("", "popup", "height=400px, width=400px");

No ‘px’ unit needed in window.open.

bobince 2009-02-12 14:24:12

Answer 6

A:

you could use something like

function writePopup(){
  var htmlString=[
    "<html>",
    "<head>",
    "<title>Written popup</title>",
    "</head><body>",
    "<p>Testing write</p>",
    "</body></html>"
  ].join("\n");
  window.open("data:text/html,"+encodeURIComponent(htmlString), "_blank", "height=400px, width=400px");
}

tmim 2010-10-25 05:49:31

ansaurus

tags:

views:

answers:

Refactoring a function that uses window.open to use the DOM rather than write()

related questions