Can't sort objects on multiple fields in JavaScript (AngularJS)

Question

EXAMPLE: http://jsfiddle.net/w38E8/4/

Please check out the above example.

CONTROLLER:

function SortCtrl($scope) {
$scope.students = [{
    'name': 'AAA',
        'year': 'sophomore',
        'score': 100,
}, {
    'name': 'ABA',
        'year': 'freshman',
        'score': 70,
}, {
    'name': 'ABC',
        'year': 'freshman',
        'score': 30,
}, {
    'name': 'BAA',
        'year': 'junior',
        'score': 90,
}, {
    'name': 'BAB',
        'year': 'junior',
        'score': 70,
}, {
    'name': 'BBA',
        'year': 'junior',
        'score': 50,
}, {
    'name': 'CAA',
        'year': 'sophomore',
        'score': 30,
}, ];

$scope.sortArr = ['name']; // Sorts the students array by this                        

$scope.sortClass = function (field) { // asc:BLUE, desc:RED
    var fieldIdx = getIndexInArray(field, $scope.sortArr);
    if (fieldIdx > -1) {
        return $scope.sortArr[fieldIdx].indexOf('-') > -1 ? 'desc' : 'asc';
    }
    return '';
};

$scope.changeSort = function (field, $event) { // When the header is clicked
    var fieldIdx = getIndexInArray(field, $scope.sortArr);

    if (fieldIdx > -1) {
        if ($event.shiftKey) {

        } else if ($scope.sortArr.length > 1) {
            $scope.sortArr = [field];
            fieldIdx = getIndexInArray(field, $scope.sortArr);
        }
        $scope.sortArr[fieldIdx] = $scope.sortArr[fieldIdx].indexOf('-') > -1 ? $scope.sortArr[fieldIdx].replace('-', '') : '-' + field;
    } else {
        if ($event.shiftKey) {
            $scope.sortArr.push(field);
        } else {
            $scope.sortArr = [field];
        }
    }

    var length = $scope.sortArr.length;

    $scope.students.sort(function (a, b) {
        var sortA = '';
        var sortB = '';
        var fieldA = '';
        var fieldB = '';

        for (var i = 0; i < length; i++) {
            if (field == 'year') {
                if (field == $scope.sortArr[i].replace('-', '')) {
                    fieldA += customOrder(a.year);
                    fieldB += customOrder(b.year);
                } else {
                    sortA += customOrder(a.year);
                    sortB += customOrder(b.year);
                }
            } else {

                if (field == $scope.sortArr[i].replace('-', '')) {
                    fieldA += a[$scope.sortArr[i].replace('-', '')];
                    fieldB += b[$scope.sortArr[i].replace('-', '')];
                } else {
                    sortA += a[$scope.sortArr[i].replace('-', '')];
                    sortB += b[$scope.sortArr[i].replace('-', '')];
                }
            }
        }


        if (sortA != sortB) { // To sort multiple fields
            if (sortA < sortB) return -1;
            if (sortA > sortB) return 1;
            return 0;
        }

        if ($scope.sortArr[getIndexInArray(field, $scope.sortArr)].indexOf('-') > -1) return fieldA == fieldB ? 0 : (fieldA < fieldB ? 1 : -1);
        else return fieldA == fieldB ? 0 : (fieldA < fieldB ? -1 : 1);
    });
};



function getIndexInArray(field, arr) {
    var idx = -1;

    angular.forEach(arr, function (value, index) {
        if (field == value.replace('-', '')) {
            idx = index;
        }
    });
    return idx;
};

function customOrder(type) {
    switch (type) {
        case 'freshman':
            return 0;
        case 'sophomore':
            return 1;
        case 'junior':
            return 2;
        case 'senior':
            return 3;
    }
};
};

So the example shows that you can sort multiple fields with pressing the shift key. Also, when you click the header, it changes the order each time.

The problem is I cannot sort the objects, YEAR:DESC, then name:ASC. What did I wrong? I am pretty sure this part is wrong:

if (sortA != sortB) { // To sort multiple fields
    if (sortA < sortB) return -1;
    if (sortA > sortB) return 1;
    return 0;
}

I have no idea how should I fix this issue. Please help me out! I am stuck on this issue for a long time!

EXAMPLE: http://jsfiddle.net/w38E8/4/

If to answer you we must go to another website, then perhaps you should try narrowing scope of your question and be more specific… — Anton Strogonoff
– Anton Strogonoff, Commented Aug 5, 2014 at 1:45

Tesseract · Accepted Answer · 2014-08-05 02:06:16Z

2

I think I got it to work.

function  ascF(a, b) { if(a < b) return -1; else if(a > b) return  1; else return 0;};
function descF(a, b) { if(a < b) return  1; else if(a > b) return -1; else return 0;};
var length = $scope.sortArr.length;

$scope.students.sort(function (a, b) {
    for (var i = 0; i < length; i++) {
        var field = $scope.sortArr[i],
            sortF = ascF;
        if(field.charAt(0) === "-") {
            sortF = descF; field = field.substring(1);
        }
        if(field === "group") field = "score";
        if(a[field] === b[field]) continue;
        if(field === "year") return sortF(customOrder(a[field]), customOrder(b[field]));
        else return sortF(a[field], b[field]);
    }
    return 0;
});

Try it here http://jsfiddle.net/9W3bC/

answered Aug 5, 2014 at 2:06

Tesseract

8,1392 gold badges23 silver badges37 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Can't sort objects on multiple fields in JavaScript (AngularJS)

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related