Problem with sorting span column

ferran_munoz

Hello!

I have a problem when I have to sort a column with span content. For example, all the cells of the column have this:

<td><span class="fa fa-check-circle m--font-danger"></span></td>

or

<td><span class="fa fa-check-circle m--font-success"></span></td>

But, when I click the column's name for sort it, it doesn't work.

This is what I do when render the cell:

    { "data": "active", className: "text-center", 
         "render": function ( data, type, row, meta ) {
            if (data == 0){
                return '<span class="fa fa-check-circle m--font-danger"></span>';
            }else{
                return '<span class="fa fa-check-circle m--font-success"></span>';
            }
        },
    }

I have to do anything when I render the cell with the info?

ferran_munoz

The solution is putting a span hidden with the value of the data. So, when you sort, it puts the info and can sort correctly.

For example:

{ "data": "active", className: "text-center",
     "render": function ( data, type, row, meta ) {
        if (data == 0){
            return '<span style="display:none">0</span><span class="fa fa-check-circle m--font-danger"></span>';
        }else{
            return '<span style="display:none">1</span><span class="fa fa-check-circle m--font-success"></span>';
        }
    },
}

Thanks!