Unescaping HTML entities in IE8

Unescaping HTML entities in IE8

earacheflearachefl Posts: 11Questions: 0Answers: 0
edited January 2013 in DataTables 1.8
Our organization is currently using datatables 1.8.2. We have a grid which is getting JSON data from serverside source. In the returned JSON data, html entities are being escaped, so, for instance, "'" (apostrophes) are returned as "'". In Chrome and Firefox, the entities are automatically unescaped, but in IE8, they are displayed in the escaped format. I've tried using fnRender:

[code]"aoColumnDefs": [
{ "aTargets": [1],
"fnRender": function(o)
{
var data = o.aData[1];
data = $("").html(data).text();
return data;
}
}
][/code]

I've also tried adding a class to the affected cells and then doing post-processing:
[code]"aoColumnDefs": [
{ "sClass": "decodeHTML", "aTargets": [1] }
]//continue dataTables initialization

//... after initialization is complete...
setTimeout(function(){
var tds = $('.decodeHTML').not('.ui-state-default');
tds.each(function(index, el){
var text = el.innerHTML;
text = text.replace(''', "'");
el.innerHTML = text;
});
}, 2000);
[/code]

The latter is particularly interesting as I can see that the .replace() function is working correctly, but the replacement text continues to display as "'", and if I change the text to a different string, I can see that the cell contents are being also replaced correctly.

Is this strictly an IE8 problem, or is this a DataTables issue? If the latter, has it been fixed in 1.9? Or is there another way to process the underlying data in individual cells prior to display that I haven't yet found?

Replies

  • earacheflearachefl Posts: 11Questions: 0Answers: 0
    Never mind... as soon as I posted, I found a way to use fnRowCallback:

    [code]
    "fnRowCallback": function(nRow, aData){
    $('td:eq(1)', nRow).text( aData[1].replace(''', "'") );
    return nRow;
    }
    [/code]

    This fixes the apostrophe only; I'll try the jQuery .html() trick as well.
  • earacheflearachefl Posts: 11Questions: 0Answers: 0
    Here's more interesting behavior. The jQuery trick, on its own, does seem to work:
    [code]
    var testString = ''';
    console.log(testString); // displays "'" in Chrome
    console.log( $("").html(testString).text() ); // displays "'" in Chrome
    [/code]

    However, inside fnRowCallback, it does NOT seem to work:
    [code]
    "fnRowCallback": function(nRow, aData){

    $('td:eq(1)', nRow).text( $("").html(aData[1]).text() ); // continues to display escaped HTML entities in IE8

    return nRow;
    }
    [/code]
    Digging deeper, if I examine the aData values in the console, they show that they seem to already BE unescaped:
    [code]
    "fnRowCallback": function(nRow, aData){
    console.log(aData);
    console.log(aData[1]); // value I care about - displays as UNESCAPED in Chrome

    return nRow;
    }
    [/code]
    BUT, as in my previous comment, using the .replace() function inside fnRowCallback:
    [code]
    $('td:eq(1)', nRow).text( aData[1].replace(''', "'") );
    [/code]
    DOES find escaped apostrophes, replaces them with unescaped apostrophes, and inserts them into the cells properly. Weird.
This discussion has been closed.