I have a simple form for managing manufacturers in my shop. After posting form, ajax call returns json with updated data to the form. Problem is, that the returned string is invalid. It looks like it was double-escaped. Strangely similar approach across the whole shop works without any problems. I'm also using jquery 1.6 as javascript framework.

Model contains of 3 fields : char for name, text for description and image field for manufacturer logo.

The function :

def update_data(request, manufacturer_id):
    """Updates data of manufacturer with given manufacturer id.
    """
    manufacturer = Manufacturer.objects.get(pk=manufacturer_id)
    form = ManufacturerDataForm(request.FILES, request.POST, instance=manufacturer)

    if form.is_valid():
        form.save()

    msg = _(u"Manufacturer data has been saved.")

    html = [
        ["#data", manufacturer_data_inline(request, manufacturer_id, form)],
        ["#selectable-factories-inline", selectable_manufacturers_inline(request, manufacturer_id)],
    ]

    result = simplejson.dumps({
        "html": html
    }, cls=LazyEncoder)
    return HttpResponse(result)

The error in console : error with invalid JSON :

uncaught exception: Invalid JSON: {"html": [["#data", "\n<h2>Dane</h2>\n<div class="\&quot;manufacturer-image\&quot;">\n \n</div>\n<form action="\&quot;/manage/update-manufacturer-data/1\&quot;" method="\&quot;post\&quot;">\n \n <div class="\&quot;field\&quot;">\n <div class="\&quot;label\&quot;">\n <label for="\&quot;id_name\&quot;">Nazwa</label>:\n </div>\n \n \n <div class="\&quot;error\&quot;">\n <input id="\&quot;id_name\&quot;" name="\&quot;name\&quot;" maxlength="\&quot;50\&quot;" type="\&quot;text\&quot;">\n <ul class="\&quot;errorlist\&quot;"><li>Pole wymagane</li></ul>\n </div>\n \n </div>\n\n <div class="\&quot;field\&quot;">\n <div class="\&quot;label\&quot;">\n <label for="\&quot;id_image\&quot;">Zdjecie</label>:\n </div>\n \n \n <div>\n <input name="\&quot;image\&quot;" id="\&quot;id_image\&quot;" type="\&quot;file\&quot;">\n </div>\n \n </div>\n\n <div class="\&quot;field\&quot;">\n <div class="\&quot;label\&quot;">\n <label for="\&quot;id_description\&quot;">Opis</label>:\n </div>\n \n \n <div>\n <textarea id="\&quot;id_description\&quot;" rows="\&quot;10\&quot;" cols="\&quot;40\&quot;" name="\&quot;description\&quot;"></textarea>\n </div>\n \n </div>\n \n <div class="\&quot;buttons\&quot;">\n <input class="\&quot;ajax-save-button" button\"="" type="\&quot;submit\&quot;">\n </div>\n</form>"], ["#selectable-factories-inline", "\n <div>\n <a class="\&quot;selectable" selected\"\n="" href="%5C%22/manage/manufacturer/1%5C%22">\n L1\n </a>\n </div>\n\n <div>\n <a class="\&quot;selectable" \"\n="" href="%5C%22/manage/manufacturer/4%5C%22">\n KR3W\n </a>\n </div>\n\n <div>\n <a class="\&quot;selectable" \"\n="" href="%5C%22/manage/manufacturer/3%5C%22">\n L1TA\n </a>\n </div>\n\n"]]}

Any ideas ?