Datatables is removing space between a tags attributes

webezine

Hi all,

I've found an unusual bug and I can't see any reason for it so thought i would ask.

I have a favourties column in my table and when you click it - it adds an icon to indicate that it's been highlighted.
I do this using the following code:

$('#csvOutput tbody').on('click', 'td.fave', function () {
var test = $(this).parent();
var tr = table.row( test ).index();

        if ($(this).html() === '<img src="../Images/fave.png">') {

            table.cell(tr, 0).data('<img src="../Images/fave-toggle.png" />').draw;
            table.cell( tr, 10 ).data('yesfave').draw();    

        } else {

            table.cell(tr, 0).data('<img src="../Images/fave.png">').draw;
            table.cell( tr, 10 ).data('').draw();   

        }
    });

As soon as this is clicked that patoicular row starts to show some anomalies- in so muich as that spaces between some tags attributes and text on that row is removed.

Ie if I click on the faves icon on row one cell 1 - the icon in cell 2 disappears because the space between the <img src> is removed - ie it becomes <imgsrc>. Also in cell 3 the text was previously "waiting to be converted" and becomes "waitingto be converted"

Any thoughts on what could be causing this?