Problem with Prototype Ajax.Request in Internet Explorer 8 prompting file download

Question

Have a set of prototype-enabled ajax code that is working in all browsers other than IE. In IE8 the JSON, that otherwise gets returned to the onSuccess handler function specified in Ajax.Request, gets thrown into a file download stream which pops up and prompts for where to download.

askForm = $('askForm');
var askUrl = '.';
var askParameters = askForm.serialize(true);
askForm.disable();

var askAjax = new Ajax.Request(
    askUrl, {
    method: 'post', 
    parameters: askParameters, 
    onSuccess: handleResults,
    onFailure: handleError
    }
);

function handleError(transport) {
   alert('Please refresh this page, an error occurred in processing at the server.');
}

function handleResults(transport) {
...
}

There is more code in the handleResults function but this never gets called. Having debugged, the download prompt occurs when the Ajax.Request function is called.

The filename IE8 prompts to download changes each time, 4 seemingly random hex values (8 characters) with no filename extension. And the contents of the file are the pure JSON response from the server...

{"question": ["Enter your question*"], "name": ["Enter your name (First L.)*"], "sender": ["Enter your e-mail*"]}

Would be much obliged for any tips here. This is occurring on Snow Leopard with IE8 running in VMWare Fusion accessing a site running via apache/django/python on OS X. However, since Chrome and Firefox in the VMWare Windows XP machine function properly, seems to point directly to IE8 as the culprit.

Answer 1

Does the server side file that sends the JSON to the browser send the proper headers? If it doesn't identify itself as JSON the browser might consider it a file to be downloaded.

Answer 2

This problem has been solved. Crazy issue here but it turns out that there was a javascript error that was preventing the script from executing and the standard form submit was occurring thru the browser thus returning AJAX code as a file download prompt. The form was designed in such a way that javascript-disabled browsers would still be able to use the form without ajax using a hidden input field with name "js". The javascript would blank the value of this field when submitting via AJAX to let server know the response should be JSON and not a full page refresh. Well, that part of the javascript that blanked the js field value processed normally but then the script errored out and thus the event.stop() javascript never executed. Resulting in the form being processed as a standard Submit button click, POST request through browser.

Note in the code above...

askForm = $('askForm');

which clearly should be...

var askForm = $('askForm');

Thanks to the browsers that allowed this syntax but it sent me on an IE8 wild goose chase as a result. Always learning.