Why does the HTML in my JSON response get encoded?

Question

I'm using this blog post as a guide, detailing how to use jQuery with jTemplates to stuff a JSON response into a template.

My problem is, one of the returned fields (named Description) contains HTML, but the HTML brackets are getting encoded to \u003C and \u003e.

Here's the HTML (in the Description field) the server returns:

<a href="/en/Yokota/User/Show/Chad">Chad</a> updated their ad, <a href="/en/Yokota/Ad/Show/100">Validation Test Ad Again</a>, @<a href="/en/Yokota">Yokota</a>

Here's what the JSON response looks like:

[{"TypeOfActivity":"0","Description":"\u003ca href=\"/en/Yokota/User/Show/YokotaTour\"\u003eYokotaTour\u003c/a\u003e posted \u003ca href=\"/en/Yokota/Ad/Show/166\"\u003eOne of the best for sure\u003c/a\u003e for sale @\u003ca href=\"/en/Yokota\"\u003eYokota\u003c/a\u003e","DateHappened":"6/23/2010 12:26:55 AM"}]

Notice the "\u003c", or "\u003e". Those look like unicode escapes, but why is that happening? Here's the jQuery making the call for JSON response:

$.getJSON("<%= Url.Action("List", "Activity") %>",
    function(data){
        $("#aLog").setTemplate($("#templateHolder").html());
        $("#aLog").processTemplate(data);
    });

UPDATE

And this is what the source looks like when the page has loaded complete (View > Page Source in Firefox):

<a href="/en/Yokota/User/Show/Chad">Chad</a> updated their ad, <a href="/en/Yokota/Ad/Show/100">Validation Test Ad Again</a>, @<a href="/en/Yokota">Yokota</a>

Maybe it's because it's nearing 3am, but I'm stumped... any help is greatly appreciated - thank you!

Update 2

public JsonResult List()
{
    IList<ActivityContract> contracts = new List<ActivityContract>();
    var activityList = _db.Activity.ByBaseID(CurrentBase.BaseID).OrderByDescending(a => a.DateHappened);
    foreach (var a in activityList) {
        contracts.Add(new ActivityContract { TypeOfActivity = a.TypeOfActivity.ToString(), Description = a.Description, DateHappened = a.DateHappened.ToString() });
    }
    return Json(contracts, JsonRequestBehavior.AllowGet);
}

Answer 1

make checks like this in the example with the "contentType" in utf8 your example

       $.ajax({
                type:"GET",
                url: "<%= Url.Action("List", "Activity") %>",
                data: "{}",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function(data){
                    $("#aLog").setTemplate($("#templateHolder").html());
                    $("#aLog").processTemplate(data);
                }
            });
        });

Answer 2

The JSONSerializer automatically escapes the "<" and ">" characters with unicode escape sequences.

jQuery should be able to parse these normally. You are using the $.getJSON method, which I thought would automatically evaluate the response as json and unescape it, so I'm a little stumped as to why the final output still contains the escape codes.

If you do:

$("#aLog").processTemplate(eval("(" + data+ ")"));

does that solve the issue?

Answer 3

Turns out, the problem was with a setting in jTemplates. The setTemplate line needed to be this:

$("#aLog").setTemplate($("#templateHolder").html(), [], {filter_data: false});

Particularly, filter_data had to be set to false. By default jTemplates html encodes. ;(