I have a datatable with server side rendering
server part is all ok, but on client side I am showing an additional column and putting progress bar in it,
The issue is when some one clicks on th of this column to sort, it is not sorting properly,
I tried different things but no luck.

    var levels = {0:1,1:2,...10:11};
    var levelPercentVal = 100/levels.length-1;
    columns : [
        { "data": 'id' },
        { "data": 'uid' },
        { "data": 'form_statuses_title_'+_lang },
        { 
            
            "name": 'level_id',
            "data": function(row, type, val, meta){ 
                var progress = Math.round(levels[row.level_id] * levelPercentVal, 0);
                //want this field to be ordered based on value of prgress variable or row.level_id
                //I also have column level filtering want to also filter in database.level_id
                var str = `<div class="progress" title="`+progress+`% done">
                                <div class="progress-bar bg-adcs text-dark" role="progressbar" style="width: `+progress+`%;" aria-valuenow="`+progress+`" aria-valuemin="0" aria-valuemax="100">
                                    `+ progress+`%
                                </div>
                            </div>`;
                return str;
            } 
        },