Thursday 15 November 2012

Sort on Table Columns

Cannot remember if I found this or wrote it or a mix of the 2. I know it uses the JQuery UI Widget tempate so you will need to make sure to include that.


/*
* jQuery UI Progressbar @VERSION
*
* Copyright 2011, AUTHORS.txt (http://jqueryui.com/about)
* Dual licensed under the MIT or GPL Version 2 licenses.
* http://jquery.org/license
*
* http://docs.jquery.com/UI/Progressbar
*
* Depends:
*   jquery.ui.core.js
*   jquery.ui.widget.js
*/
(function ($, undefined) {
 
    $.widget("ui.columnsort", {
        version: "@VERSION",
        options: {
 
        },
 
        _create: function () {
            var self = this.element;
            $(self).addClass("sortTable").find("tr:first").addClass("sortColumns").children().addClass("sortColumn")
            .disableSelection().css("cursor""pointer").click(this._sortByColumn);
        },
        _sortByColumn: function () {
            var sortCell = $(this).closest(".sortColumn");
            var selectedIndex = sortCell.index();
            var hadclass = $(sortCell).hasClass("asc");
            $(sortCell).closest(".sortColumns").find(".sortColumn").removeClass("asc").removeClass("desc");
            hadclass ? $(sortCell).addClass("desc") : $(sortCell).addClass("asc");
            var table = $(this).closest("table");
            var rows = $(table).find("tr:not(.sortColumns)");
            rows.sort(function (a, b) {
                var keyA = $('td:eq(' + selectedIndex + ')', a).text();
                var keyB = $('td:eq(' + selectedIndex + ')', b).text();
                var checkkeyA = parseInt(keyA);
                var checkkeyB = parseInt(keyB);
                if (!parseInt(keyA)) {
                    checkkeyA = keyA;
                    checkkeyB = keyB;
                }
                if ($(sortCell).hasClass('asc')) {
                    return (checkkeyA > checkkeyB) ? 1 : -1;
                }
                else {
                    return (checkkeyA < checkkeyB) ? 1 : -1;
                }
            });
 
            rows.each(function (index, row) {
                if ($(row).hasClass("resultstableitema") || $(row).hasClass("resultstableitemb")) {
                    $(row).removeClass("resultstableitema").removeClass("resultstableitemb");
                    if (index % 2) {
                        $(row).addClass("resultstableitemb");
                    }
                    else {
                        $(row).addClass("resultstableitema");
                    }
                }
                table.append(row);
            });
        },
        _destroy: function () {
            this.element
   .removeCss("cursor");
        }
    });
})(jQuery);

No comments:

Post a Comment