Creating popup using DOM and *no* html src

[jonathon]

Hi all,

I have a web app with a popup window for entering data. I don't want
to access the web every time this window is opened, as most of the app
is AJAX. But I can't figure out how to open a new window and build it
with DOM rather than having to provide a src. Even a blank.html as src
takes time to fetch.

How can I create a popup and dynamically add DOM content without any
html at all?

[Matt Kruse]

jonathon wrote:

How can I create a popup and dynamically add DOM content without any
html at all?

Unfortunately, you can't. When you open a window, it must have a url.

A work-around is to use the url of "about:blan k", but this causes security
warnings on secure sites, and doesn't work in some browsers. You can use a
javascript: pseudo-protocol to write out dummy content, but this also throws
up security warnings in some cases. You can leave a blank url, but only some
browsers prefer this over about:blank.

This is, IMO, unfortunate. There should be a cross-browser way to pop up a
new window and fill it with content without any security issues or problems.

If anyone knows of a solution, I would _love_ to know it.

--
Matt Kruse
http://www.JavascriptToolbox.com
http://www.AjaxToolbox.com

[Xandax]

I am not familiar with ajax, so I don't know if this is a plausible
solution:

But the only other idea I would be able to think of is to actually make
the "popup" as content inside a div element which is hidden. Then on
some event you make it visible, and using z-index style you can then
position it above the other content.
I don't know if this is an acceptable avenue to venture down, but it
would be a possible way to mimic a "popup" without actually having to
supply an url for a window.open();

[jonathon]

Matt Kruse wrote:

jonathon wrote:

How can I create a popup and dynamically add DOM content without any
html at all?

Unfortunately, you can't. When you open a window, it must have a url.

Actually, I found a site where you can do this.

http://oit.wvu.edu/support/training/...OM/calvin.html

The 'Reader()' function opens a popup without any src and write()'s
content as a string to the new window. But my window is just a bit
more complex than this one, and doesn't lend itself to this approach.
Especially since it uses iframes.

[jonathon]

Xandax wrote:

I am not familiar with ajax, so I don't know if this is a plausible
solution:

But the only other idea I would be able to think of is to actually make
the "popup" as content inside a div element which is hidden. Then on
some event you make it visible, and using z-index style you can then
position it above the other content.

That's a possibility. A very good one, actually. I prefer the windows
that seem to be part of the page rather than entirely separate anyway.
I'll give that a shot.

[Matt Kruse]

jonathon wrote:

Actually, I found a site where you can do this.
http://oit.wvu.edu/support/training/...OM/calvin.html

This just passes an empty string as the url. This won't work in some
browsers.

--
Matt Kruse
http://www.JavascriptToolbox.com
http://www.AjaxToolbox.com

[Gérard Talbot]

Matt Kruse wrote :

jonathon wrote:

How can I create a popup and dynamically add DOM content without any
html at all?

Unfortunately, you can't.

Well, I disagree. E.g.:

Create a sub-window and dynamically DOM-insert an image
http://www.gtalbot.org/DHTMLSection/...geInPopup.html
When you open a window, it must have a url.

A work-around is to use the url of "about:blan k", but this causes security
warnings on secure sites, and doesn't work in some browsers.
It should not work on all browsers which apply correctly the
cross-domain script security restrictions:
http://www.mozilla.org/projects/secu...me-origin.html
also explained at
http://developer.mozilla.org/en/docs...indow.open#FAQ
You can use a
javascript: pseudo-protocol to write out dummy content, but this also throws
up security warnings in some cases. You can leave a blank url, but only some
browsers prefer this over about:blank.

Again, about:blank is an unique domain name...
This is, IMO, unfortunate. There should be a cross-browser way to pop up a
new window and fill it with content without any security issues or problems.

Well, yes, there is.

Gérard
--
remove blah to email me

[Gérard Talbot]

Xandax wrote :

I am not familiar with ajax, so I don't know if this is a plausible
solution:

But the only other idea I would be able to think of is to actually make
the "popup" as content inside a div element which is hidden. Then on
some event you make it visible, and using z-index style you can then
position it above the other content.

http://www.netscape.com/
does almost that on a load event. The What's new box moves into the
viewport for 10 sec. or so and then moves back into a negative top value.
Click the yellow "What's new" button if you want to see it in action again..

I don't know if this is an acceptable avenue to venture down, but it
would be a possible way to mimic a "popup" without actually having to
supply an url for a window.open();

Yeah, but it's as annoying as a popup actually. It's still the same too:
unrequested content popping up, popping in the browser viewport.
Netscape DevEdge had a article on how to bypass unrequested popups and
Netscape was among the first to use it. It's sooooo stupid!

Gérard
--
remove blah to email me

[Matt Kruse]

Gérard Talbot wrote:

Unfortunately, you can't.

Well, I disagree. E.g.:
Create a sub-window and dynamically DOM-insert an image
http://www.gtalbot.org/DHTMLSection/...geInPopup.html

This example doesn't demonstrate your (incorrect) point.
It opens a file called "PopupWindowOnl yImage.html" when it does window.open.
It doesn't open a "blank" window with no contents.

This is, IMO, unfortunate. There should be a cross-browser way to
pop up a new window and fill it with content without any security
issues or problems.

Well, yes, there is.

Try again :)

--
Matt Kruse
http://www.JavascriptToolbox.com
http://www.AjaxToolbox.com

[Csaba Gabor]

Gérard Talbot wrote:

Xandax wrote :

But the only other idea I would be able to think of is to actually make
the "popup" as content inside a div element which is hidden. Then on
some event you make it visible, and using z-index style you can then
position it above the other content.

http://subimage.com/sublog/subModal
Yeah, but it's as annoying as a popup actually. It's still the same too:
unrequested content popping up, popping in the browser viewport.
Netscape DevEdge had a article on how to bypass unrequested popups and
Netscape was among the first to use it. It's sooooo stupid!

But having given the link, I agree with Gérard. These divs
implementing popups are a real annoyance because they cover content and
you cannot be sure when you click on them what they will do (I'm
thinking specifically of news sites that pop up one of these ads that
cover content). Even if they eventually become well implemented to the
point of having a nice fake title bar, and are draggable, etc. they
will still make me suspicious because I don't know their standard
functionality. That means, that a click on a good looking fake popup
might actually be license for a real popup to be popped up. By the
way, I just had a thought... since popup blockers generally don't block
popups from user initiated actions, can you (a) accumulate a bunch of
popups just based on a single action like a click (since it's actually
a mouse down, mouse up, mouse click)? (b) delay the actual popping
(sort of save up your popup popping credits and spew them all out at
the end - possibly in conjunction with window.setTimeo ut)?. As opposed
to another poster, I WANT to be able to move a popup so that it doesn't
cover the parent window so I can read the entire parent window. The
upshot: in general, I recommend against this route.

Csaba Gabor from Vienna