AJAX's XMLHttpRequest used to bring back PDF and Excel docs?

Can I use the XMLHttpRequest object to call a url which would generate a PDF and then display it to the screen?

I’m new to AJAX and I’m very interested in using it to asychronously bring back documents with a content-type that IS NOT text/plain or text/html (like a PDF or Excel document) and then display that document to the screen. I have a web application that dynamically generates PDF and Excel documents. A user may have to wait a minute for the new doc to be created and displayed to the user. I want to put an animated notice saying the doc is being generated similar to what you see when you execute a search on a search engine. I’ve tried using animated gifs (with frames, etc.) but they don’t work. As soon as a request is sent for the PDF, the browser halts the gif in IE. If I could instead call the URL that will produce the PDF asynchronously, then I could display the animated gif and call the PDF at the same time. Once the PDF is generated, I want it to then be displayed to the screen.

Can I do this with AJAX?

Not really since you wouldn’t be updating the page with the same type of content. This is probably one of few occasions where I’d suggest opening another window or changing an iframe’s src to display the PDF/excel doc.

Are you saying that the XMLHttpRequest (req) can only return the same content type as it was generated from? I guess the req object is generated by a web browser interpreting HTML so I guess it can only return content type of text.

I was hoping that the XMLHttpRequest (req) would gather the response from the server and then I could choose to open that response in the browser.

I don’t want to use an iframe for various reasons. As for the new window, how would you use it? By the way, these docs are generated by input forms that have validation. If I have the submit button open a new window and then there is an input validation problem, then the user would see the form repeated in 2 windows except the new window would have input errors displayed.

A XMLHttpRequest is intended to be used to update the content of the current page. Since the current page is HTML you need to return something that can be incorporated into HTML such as text.

To be able to display a PDF or Excel file means either loading an entire frame or loading it into an iframe in the current page in order to be able to display the new file format. Neither of these require XMLHttpRequest as in each case you can load the new page directly.

For opening ina new window you could try:

<a href=“myfile.pdf”>PDF</a>
<a href=“myfile.xls”>XLS</a>

or if you particularly need it in Javascript:

location.href=“myfile.pdf”;
location.href=“myfile.xls”;

I don’t know why it wouldn’t be possible, at least using something like a “hack”. I don’t know if this works with pdf’s/excel as i never used with those, but try something like


var url="http://theurlthatgeneratesyourpdforexcel";
var xhttp = new ActiveXObject("Microsoft.XMLHTTP"); //don't forget the other browsers too
xhttp.open("GET", url, true); // or POST if you have to send info
xhttp.onreadystatechange = function(){
   if (xhttp.readyState == 4)
			{
				document.location.href=url;				
			}
		}
xhttp.send(null);

if this works, you can have your animations in the page until the pdf/excel is on the client side and then display it, if it doesen´t work, then go to the new page/iframe solution…

BTW, it works great for me but for loading images generated by a servet, not pdf/excels…

Hmmm, I will try that but it looks as if you are just calling the document twice. You first execute the dynamic creation of the document (PDF, excel, etc.) when you call:

xhttp.open(“GET”, url, true);

Then you call the same url again . . .

document.location.href=url;

You might as well just call the URL directly unless I’m missing something. How does this buy you anything?

You might as well just call the URL directly unless I’m missing something.

Exactly felgall’s point.

The problem with trying to load PDFs into a page is that PDFs are not rendered natively by the browser. They require a plugin, most commonly the Adobe Acrobat reader, for rendering.

Browsers vary in their ability to properly display PDFs in an iframe. A separate window will probably give more satisfactory results. Bear in mind that popup blockers may hamper such an approach.

As its name suggests, the XMLHttpRequest is only designed to retrieve XML or text from the server. Neither PDFs nor Excel spreadsheets constitute such content, nor does the browser’s rendering engine have the means to display such content directly.

Like i said, it works for JPEGS/GIFS, if you want to see it in action go to http://www.humbertodelgado.pt in Arquivo Digital (you’ll have to know some portugusese, it only works with IE unforntunatly). I didn´t said it will work for pdf/excel, i said try it out, if it work with images maybe it work with other types of docs too. And i did mention the word “hack” too.

The reason it works with images is very simple, the second time the URL is referenced the browser checks the image referenced by that URL allready exist in the cache and will retrive from the cache, not from the URL again. In fact, at that site i do things a litle more complicated, i load the images assynchronously (using a “loading” gif while loading), then when finished loading i check the images width/lenght and sometimes resize it.

It works very well.

Out of curiosity, i just tryed with a pdf file. Aparently, it works, but i don’t really can tell if the server is hit once or twice. Also, IE has some very peculiarities, so to speak, regarding cache issues. Sometimes get things from cache even when it is suposed not to do. I had that experience but allways with images, but i’m curious about your experinces, i’ll like if you could post back your results…