download PDF in new window

[Michael]

I am trying to allow a user to view a PDF in a new window. I
currently have this working using the following:

<a href="./pdf.do?parameter=01121980" target="top"><b>pdf</b></a>

The problem with the above solution is the back/forward buttons and
all the other browser options. Because of this, I am trying to get
the following solution to work:

<a href="#" onclick="popUp('./pdf.do?parameter=01121980')"><b>pdf</b></a>

function popUp(url)
{
window.open(url, "PDF",
"width=500,height=500,status=no,toolbar=no,menubar =no");
}

When I use this implementation, I get a window asking if I'm sure I
want to download the file (which I do not get from the first
implemenation). I click yes, and it says it was unable to download
the file. Just as an experiment, I have taken the url that ends up in
the location bar from the working method and pasted it in a new
browser window. That gives me the same error as the popup function
method. I'm stuck. Any help would be appreciated.

Thanks,
Mike

[Evertjan.]

Michael wrote on 10 sep 2003 in comp.lang.javascript:

I am trying to allow a user to view a PDF in a new window. I
currently have this working using the following:

target="_blank"
<a href="./pdf.do?parameter=01121980" target="_blank">pdf</a>


--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

[DU]

Michael wrote:

I am trying to allow a user to view a PDF in a new window. I
currently have this working using the following:

<a href="./pdf.do?parameter=01121980" target="top"><b>pdf</b></a>

The problem with the above solution is the back/forward buttons and
all the other browser options.
Hold it right there! Since no window has the name "top" (note here that
it is "top" and not "_top" ... which would be a different story), a new
window will be created in which the Back and Forward buttons will be
dimmed since such new window has no history. So what is the problem you
see with dimmed Back and Forward buttons? Is it that they (toolbar)
unneedlessly take space on the screen?

For the sake of readability and code understanding, I would choose an
entirely different identifier for the new window as top and _top are
much too close in reading but very much different in webpage meaning.
One is an HTML recognizable keyword identifier; the other is not.
http://www.w3.org/TR/html401/types.h...e-frame-target

Because of this, I am trying to get the following solution to work:

<a href="#" onclick="popUp('./pdf.do?parameter=01121980')"><b>pdf</b></a>

function popUp(url)
{
window.open(url, "PDF",
"width=500,height=500,status=no,toolbar=no,menubar =no");
}
It's definitvely not recommendable to remove statusbar as the statusbar
communicates (or should communicate) reliable, trustworthy, genuine and
unaltered browser messages, info about connection, download, http,
secure connection (SSL) via padlock icon, etc... IMO, every single popup
on the web that tries to remove the statusbar - for whatever reason - is
not trustworthy: I'm the only one who could be using the info of such
toolbar coming directly from the browser itself.

Your window.open call will also make such new window unscrollable and
unresizable: that's counter-accessibility, anti-usability and
definitively not recommendable. What happens to the user if 500x500 is
too wide or too small? What happens if the user can not scroll up/down
your document? Learn to give normal and usual latitude and normal powers
to your own users over their own browser windows, visitors and they'll
come back to your site. It is in your own best interests to give your
user, visitor a normal access to your own content: so give such window
its standard features such as resizability and scrollbars (if needed; if
content overflows windows dimensions)

When I use this implementation, I get a window asking if I'm sure I
want to download the file (which I do not get from the first
implemenation). I click yes, and it says it was unable to download
the file.
Because, (most likely; am not 100% sure since this involves PDF
downloading) you're not canceling the default action of the link being
clicked. You're missing "return false;" in the onclick event handler.

Just as an experiment, I have taken the url that ends up in the location bar from the working method and pasted it in a new
browser window. That gives me the same error as the popup function
method. I'm stuck. Any help would be appreciated.

Thanks,
Mike

Here's a full answer, fixing a lot of pitfalls and (usability,
accessibility) problems you could be having:

<script type="text/javascript">
var WindowObjectReference;
function OpenRequestedPopup(strUrl, strWindowName)
{
if(WindowObjectReference == null || WindowObjectReference.closed)
{
WindowObjectReference = window.open(strUrl, strWindowName,
"width=500,height=400,resizable=yes,scrollbars=yes ,status=yes");
}
else
{
WindowObjectReference.focus();
};
}
</script>

<a href="./pdf.do?parameter=01121980" target="ANewWindowForPDF"
onclick="OpenRequestedPopup(this.href, this.target); return false;"
title="Clicking this link will create or re-use a new window
(popup)"><b>pdf</b><img
src="http://www10.brinkster.com/doctorunclear/GRAPHICS/PNG/OpenRequestedPopup.png"
width="25" height="25" alt="Clicking the link will create a new window
(popup) or will re-use an already opened one"> </a>

I chose a long identifier for the target because if the user
right-clicks the link and views its properties, he will be informed fair
and square that such link is supposed/intended to open the referenced
resource in a new window. If he wants to override this intended action
(say, open the ref. res. in a new tab), then he will be able to without
problems: he's the user of such page, link, resource, not me.
Also, if your user has javascript disabled, then the pdf ref. res. will
be opened in the same window.

This code could be furthermore improved, tuned: I don't have details on
your page design.

More reading:

Open a link in a new window: when and how can that setting affect my
surfing?
http://www10.brinkster.com/doctorunc...nLinkNewWindow

A full example of using and re-using a single popup window with all
recommended accessibility and usability guidelines (Nielsen, WAI):
http://www10.brinkster.com/doctorunc...pera7Bugs.html

DU
--
Javascript and Browser bugs:
http://www10.brinkster.com/doctorunclear/
- Resources, help and tips for Netscape 7.x users and Composer
- Interactive demos on Popup windows, music (audio/midi) in Netscape 7.x
http://www10.brinkster.com/doctorunc...e7Section.html

[Michael]

> Hold it right there! Since no window has the name "top" (note here that

it is "top" and not "_top" ... which would be a different story), a new
window will be created in which the Back and Forward buttons will be
dimmed since such new window has no history. So what is the problem you
see with dimmed Back and Forward buttons? Is it that they (toolbar)
unneedlessly take space on the screen?

For the sake of readability and code understanding, I would choose an
entirely different identifier for the new window as top and _top are
much too close in reading but very much different in webpage meaning.
One is an HTML recognizable keyword identifier; the other is not.
http://www.w3.org/TR/html401/types.h...e-frame-target

Because of this, I am trying to get

the following solution to work:

<a href="#" onclick="popUp('./pdf.do?parameter=01121980')"><b>pdf</b></a>

function popUp(url)
{
window.open(url, "PDF",
"width=500,height=500,status=no,toolbar=no,menubar =no");
}

It's definitvely not recommendable to remove statusbar as the statusbar
communicates (or should communicate) reliable, trustworthy, genuine and
unaltered browser messages, info about connection, download, http,
secure connection (SSL) via padlock icon, etc... IMO, every single popup
on the web that tries to remove the statusbar - for whatever reason - is
not trustworthy: I'm the only one who could be using the info of such
toolbar coming directly from the browser itself.

Your window.open call will also make such new window unscrollable and
unresizable: that's counter-accessibility, anti-usability and
definitively not recommendable. What happens to the user if 500x500 is
too wide or too small? What happens if the user can not scroll up/down
your document? Learn to give normal and usual latitude and normal powers
to your own users over their own browser windows, visitors and they'll
come back to your site. It is in your own best interests to give your
user, visitor a normal access to your own content: so give such window
its standard features such as resizability and scrollbars (if needed; if
content overflows windows dimensions)

When I use this implementation, I get a window asking if I'm sure I
want to download the file (which I do not get from the first
implemenation). I click yes, and it says it was unable to download
the file.

Because, (most likely; am not 100% sure since this involves PDF
downloading) you're not canceling the default action of the link being
clicked. You're missing "return false;" in the onclick event handler.

Just as an experiment, I have taken the url that ends up in

the location bar from the working method and pasted it in a new
browser window. That gives me the same error as the popup function
method. I'm stuck. Any help would be appreciated.

Thanks,
Mike

Here's a full answer, fixing a lot of pitfalls and (usability,
accessibility) problems you could be having:

<script type="text/javascript">
var WindowObjectReference;
function OpenRequestedPopup(strUrl, strWindowName)
{
if(WindowObjectReference == null || WindowObjectReference.closed)
{
WindowObjectReference = window.open(strUrl, strWindowName,
"width=500,height=400,resizable=yes,scrollbars=yes ,status=yes");
}
else
{
WindowObjectReference.focus();
};
}
</script>

<a href="./pdf.do?parameter=01121980" target="ANewWindowForPDF"
onclick="OpenRequestedPopup(this.href, this.target); return false;"
title="Clicking this link will create or re-use a new window
(popup)"><b>pdf</b><img
src="http://www10.brinkster.com/doctorunclear/GRAPHICS/PNG/OpenRequestedPopup.png"
width="25" height="25" alt="Clicking the link will create a new window
(popup) or will re-use an already opened one"> </a>

I chose a long identifier for the target because if the user
right-clicks the link and views its properties, he will be informed fair
and square that such link is supposed/intended to open the referenced
resource in a new window. If he wants to override this intended action
(say, open the ref. res. in a new tab), then he will be able to without
problems: he's the user of such page, link, resource, not me.
Also, if your user has javascript disabled, then the pdf ref. res. will
be opened in the same window.

This code could be furthermore improved, tuned: I don't have details on
your page design.

More reading:

Open a link in a new window: when and how can that setting affect my
surfing?
http://www10.brinkster.com/doctorunc...nLinkNewWindow

A full example of using and re-using a single popup window with all
recommended accessibility and usability guidelines (Nielsen, WAI):
http://www10.brinkster.com/doctorunc...pera7Bugs.html

DU

FYI, that didn't work. My question was not about usability. The
solution provided does not change, technically what happens (a
window.open call opens a new window with the provided link). That
didn't work when I coded it and still doesn't work. That's the
problem. When I click on the new link, I still get a new window with
a warning giving me the options Open, Save, Cancel or More Info. If I
click open or save, it says "Internet Explorer cannot download " url
"from localhost. Internet Explorer was not able to open this Internet
site. The requested site is either unavaliable or cannot be found.
Please try again later".