Jquery $.ajax() json call to *.js file causes browser to ask 'save/open'

Question

I'm able to issue $.ajax() requests to urls that have a '.js' extension just fine when I use {...'dataType' : 'script'...}. However, when I use {...'dataType' : 'json'...} the browser (Opera and FF, so far, but I'll bet it's universal) asks to save/open the results of the request.

Note that my 'success' callback runs fine and uses the resulting json object just fine.

My question is, should I just drop the *.js extension from the resource and pass a 'json=true' option? Or is there a handy way to stop the browser from trying to render/save/open the result? (By handy I mean, of course, not something that every user has to set in their browser.)

Also note that I'm using Rails, so the header order routing issue prevents me from using an Accept header to fix this.

Answer 1

Well, the 'correct' file extension for a JSON file is .json, not .js. Have you tried that?

Answer 2

I might be wrong here, but I suspect you forgot to return false from your event handler. So your request is being propagated to the default handler. Or as pointed out by nickf a bug that causing your script to fail. Try to wrap your code in a try catch and see if you get any error:

try {
   // your code
} catch(e) {
   alert(e);
}

Answer 3

Oh. This is a riot. Apparently, it's important not to comment out the statement 'return false;' at the end of your event handlers.

I must have inadvertently done so while commenting out some other code near the end of the handler.

Stay tuned for more 1337 h4x0r advice in teh future!