Question

I have html, and jquery for sorting my table (also there is non-standart sorting (with multi-tbody)).

jQuery(function($) {
    var table = $('table');
    $(document).ready(function() {
        on_loaded($('.prcol'));
        $('.prcol').click(function(e) {
            on_loaded(this);
            e.preventDefault();
        });
    });

    function on_loaded(met) {
        var $sort = met;
        var $table = $('#articles-table');
        var $rows = $('tbody.analogs_art > tr', $table);
        $rows.sort(function(a, b) {
            var keyA = $('td:eq(3)', a).text().toUpperCase();;
            var keyB = $('td:eq(3)', b).text().toUpperCase();;

            if (keyA.length > 0 && isNaN(parseFloat($('td:eq(3)', b).text()))) return Ascending(keyA, keyB);
        });
        $.each($rows, function(index, row) {
            //console.log(row);
            $table.append(row);
            //$("table.123").append(row);
        });
    }

});


function Ascending(a, b) {
    if (a > b) return -1;
    if (a < b) return 1;
    return 0;
}

My code could be found here: http://jsfiddle.net/hGCgX/2/

But why it is sorting only in webkit browser’s? In ff and ie and opera i see nothing change… But why? How to do cross-browser sorting of html table?
also don’t say me to use tablesorter, why you have so much tbodie’s etc…

Answer 1

I got it to sort in Opera as follows :

$(function(){
    var $table = $('#articles-table');
    var $tbody = $('tbody.analogs_art', $table);
    var $rows = $tbody.children("tr");

    function on_loaded() {
        Array.prototype.sort.call($rows, function(a, b) {
            var keyA = Number($('td', a).eq(3).text()) || 0;
            var keyB = Number($('td', b).eq(3).text()) || 0;
            return keyB - keyA;
        });
        $.each($rows, function(index, row) {
            $tbody.append(row);
        });
    };
    $table.find("th").eq(3).on('click', function() {
        on_loaded();
    });
});

See updated fiddle