Custom Sorting & Disabling sorting per column

Custom Sorting & Disabling sorting per column

TryHardSniprTryHardSnipr Posts: 3Questions: 1Answers: 0

I've been searching around for a bit now, and haven't been able to find anything that will help me with my problem.

Currently i'm working on a Game server and am setting up a table showing users all the commands they can use within the game. What I would like to do is sort the first 'Rank' column by the level of the rank, so instead of alphabetical order, I want it to sort by: Newbie, Citizen, Iron, Gold, Diamond and Moderator, and vice versa. Here is a link to the table I am working on: http://forum.ic-gaming.uk/pages/minecraft-commands/

Secondly, I would like to know if it possible to disable sorting on each column, specifically the 'Description' and 'Syntax' columns in my case.

Any help is greatly appreciated.
-TryHardSnipr

This question has an accepted answers - jump to answer

Answers

  • visionxvisionx Posts: 22Questions: 4Answers: 5
    Answer ✓

    You can easily achieve it by writing a custom sort function.

    $(document).ready(function() {
        $('#example').DataTable( {
            dom: 'C<"clear">lfrtip',
            "aoColumns": [{
                "sType": "rank",
                "bSortable": true
            }, 
            {
                "bSortable": true
    
            },
            {
                "bSortable": true
            },
            {
                "bSortable": false
    
            },
            {
                "bSortable": false
    
            }
            
            ]
        
        } );
    } );
    
    function getRank(name) {
    
        var rankNumber;
        
        if (name == "Moderator"){
            rankNumber = 1;
        } else if (name == "Diamond"){
            rankNumber = 2;
        } else if (name == "Gold") {
            rankNumber = 3;
        } else if (name == "Iron") {
            rankNumber = 4;
        } else if (name == "Citizen") {
            rankNumber = 5;
        } else if(name == "Newbie"){
            rankNumber = 6;
        } else {
            rankNumber = 0;
        }
        
        return rankNumber;
    }
    
    
    jQuery.fn.dataTableExt.oSort["rank-desc"] = function (x, y) {
        
            return getRank(x) < getRank(y);
    };
        
    jQuery.fn.dataTableExt.oSort["rank-asc"] = function (x, y) {
            return getRank(x) > getRank(y);
    }
    
  • allanallan Posts: 63,680Questions: 1Answers: 10,498 Site admin

    Worth putting the plug-in code before it could potentially be used. It depends what happens with the document ready function (it might execute immediately depending on code organisation, in which case an error would result). But that's the only thing I've got to add :-)

    Allan

  • TryHardSniprTryHardSnipr Posts: 3Questions: 1Answers: 0
    edited February 2015

    Thanks for the help guys, the disabling of columns defiantly worked, but at the moment the ranks column seems to just sort randomly with this code, not even alphabetically. I tried re-organizing parts of the code, but that didn't help, i'm not really knowledgeable on Javascript, so unfortunately not sure what the problem may be.

  • visionxvisionx Posts: 22Questions: 4Answers: 5

    I tested it on your site. Seems like it is ok for me. What is the order that you want to sort ? It is based on the rank level that you defined in the "getRank(name)" function. As now same rank levels are grouped and displayed and others are changing according to rank levels defined. Also note that now it is not sorted according to alphabetical order since you have altered the default sort function.

  • TryHardSniprTryHardSnipr Posts: 3Questions: 1Answers: 0
    edited February 2015

    The way I wanted it to work was when the user loads up the page, they see the lowest ranks first, and highest ranks last. The order being Newbie, Citizen, Iron, Gold, Diamond, Moderator and Administrator, with Newbie being the lowest and Admin being highest.

    When I first load up the page right now, it loads as such: http://gyazo.com/fe93f49d639627c74615c90c53e13662 with Newbie loading between Citizen. Also, if I was to re order the Rank column, it will re-sort the ranks slightly randomly, instead of just alternating between Lowest - Highest, Highest - Lowest, and changing the page of the table messes the ordering up too.

    For reference, the code I have in at the moment is this:

    $(document).ready(function() {
        $('#example').DataTable( {
            dom: 'C<"clear">lfrtip',
            "aoColumns": [{
                "sType": "rank",
                "bSortable": true
            },
            {
                "bSortable": true
     
            },
            {
                "bSortable": true
            },
            {
                "bSortable": false
     
            },
            {
                "bSortable": false
     
            }
             
            ]
         
        } );
    } );
    
    function getRank(name) {
     
        var rankNumber;
         
        if (name == "Newbie"){
            rankNumber = 1;
        } else if (name == "Citizen"){
            rankNumber = 2;
        } else if (name == "Iron") {
            rankNumber = 3;
        } else if (name == "Gold") {
            rankNumber = 4;
        } else if (name == "Diamond") {
            rankNumber = 5;
        } else if(name == "Moderator"){
            rankNumber = 6;
        } else if(name == "Administrator"){
            rankNumber = 7;
        } else {
            rankNumber = 0;
        }
         
        return rankNumber;
    }
    
    jQuery.fn.dataTableExt.oSort["rank-desc"] = function (x, y) {
            return getRank(x) < getRank(y);
    };
         
    jQuery.fn.dataTableExt.oSort["rank-asc"] = function (x, y) {
            return getRank(x) > getRank(y);
    }
    
This discussion has been closed.