How to do sorting with filesizes in bootstrap table?

Question

I have built this grid:

So far so good, but when I mark as sortable the column with the filesize, it doesn't sort well. How do I make the filesize colum sortable?

Thanks.

Answer 1

I managed to do it by hand:

HTML:

<table id="table" class="table borderless">
    <thead>
        <tr>
            <th data-field="Type" data-sortable="false" data-formatter="typeFormatter" data-cell-style="typeStyle" class="text-center">Type</th>
            <th data-field="Content Type" data-sortable="true">Content Type</th>
            <th data-field="Name" data-sortable="true">Name</th>
            <th data-field="Received" data-sortable="true">Received</th>
            <th data-field="File Size" data-sortable="true" data-sorter="filesizeSorter">File Size</th>
            <th data-field="" data-formatter="operateFormatter" data-events="operateEvents"></th>
        </tr>
    </thead>
</table>

JavaScript:

//filesize column custom formatter
function filesizeSorter(a, b) {

    var a_number = retnum(a);
    var b_number = retnum(b);

    a = a_number;
    b = b_number; 
    if (a > b) return 1;
    if (a < b) return -1;
    return 0;
}

//return bytes of filesize
function retnum(number) {
    var num = number.replace(/[^0-9]/g, '');
    var filesizename = number.replace(/[^a-zA-Z]+/g, '').toUpperCase();
 
    num = parseInt(num, 10);

    switch (filesizename) {
        case "KB":
            num = num * 1024;
            break;
        case "MB":
            num = num * Math.pow(1024, 2);
            break;
        case "GB":
            num = num * Math.pow(1024, 3);
            break;
        case "TB":
            num = num * Math.pow(1024, 4);
            break;
    }

    return num;
}