Django Development Server Not Serving Errors from Ajax Requests

I've been trying to get some Ajax stuff to work in my Django application, but it has been difficult because for some reason syntax and type errors are not causing a server crash and are failing silently. How could this be?

JavaScript (jQuery):

 add_foo = function() {
   var numfoos = $("div#foos_container > div.foo").length + 1;
   var foo_id = numfoos + "-foo";
   var div = $("<div></div>").attr("id",foo_id).addClass("foo");
   div.load("http://localhost:8000/ajax/get/url/");
   div.appendTo("div#foos_container");
    };

Python:

def ajax_add_foo(request):     
  print request.session['editing_foos'].keys()
  keys = request.session['editing_foos'].keys()
  if len(keys) == 0:
    next_key = 1
  else:
    next_key = max([ id_from_prefix(key) for key in keys ])
  print next_key

  form = FooForm(prefix=next_key)
  print next_key
  request.session['editing_foos'].up开发者_运维技巧date( {create_prefix(FooForm, next_key) : -1 } ) # This foo is new and has no pkey
  print request.session['editing_foos']
  return render_to_response( 'bar/foo_fragment.html',
        {'fooform' : fooform, },
        context_instance=RequestContext(request))

On Ajax errors, Django still generates the full "debug screen", but it doesn't display automatically.

Register a global handler for jQuery Ajax errors that opens the "responseText" in a new window: ( put this code into your "onready" )

$(document).ajaxError(function(event, XMLHttpRequest, ajaxOptions, thrownError){
    // open the Django Debug screen in a new window: 
    var w = window.open('','','');
    w.document.write(XMLHttpRequest.responseText);          
});

This causes the familiar Django "debug" page to pop up on ajax errors.

This is probably because server returns error code (500) and your jQuery cod doesn't do anything on error. Could you post $.get or $.post code you are using?

EDIT: If you are using $.load, there is a place for a callback function, that you can create to display errors. It's pretty simple, you need to define a function similar to this:

function (responseText, textStatus, XMLHttpRequest){
    if (textStatus < 200 || textStatus >= 299){
        $(document).html(responseText);
    }
}

This way you will put error message into the whole document and see it. I don't exactly know, if the above works, because I can't test it, but you should be able to construct something working on this.

Where are you looking for the error report? It obviously won't appear in the main web page, since you haven't requested a full page refresh. The best way to debug Ajax is via Firebug, where you can look in the Console tab - you'll see a line for each Ajax request, which will be red if an error occurred. You can then expand that line to see the full response, ie the nice Django traceback, which you can also open in a new tab.

If you use $.ajax there is an error callback setting, this was pretty simple to implement:

$.ajax({
  ...
  error: function(XMLHttpRequest, textStatus, errorThrown){
    document.write(XMLHttpRequest.responseText);
  },
  ...
});