Arranging numbers in JavaScript lists

Question

Arranging numbers in JavaScript lists

        empList = [
        { "Account": "AAA - 0029", "Available": "$100" },
        { "Account": "BBB- 0146", "Available": "200" },
        { "Account": "AAA - 1812", "Available": "300"},
        { "Account": "CCC- 2019", "Available": "400"},
        { "Account": "FYC- 3810", "Available": "500"},
        { "Account": "HHH- 5210", "Available": "600"},
        ]

My list of accounts needs to be sorted based on the numbers in the Account property, either ascending or descending. I've attempted various methods without success. The "-" is used as a delimiter to split "AAA - 0029".

javascript angularjs

Answer 1

Answer №1

angular.module('app', [])
.controller('MyController', ['$scope', function($scope) {
    $scope.empList = [
        { "Account": "AAA - 0029", "Available": "$100" },
        { "Account": "BBB- 0146", "Available": "200" },
        { "Account": "AAA - 1812", "Available": "300"},
        { "Account": "CCC- 2019", "Available": "400"},
        { "Account": "FYC- 3810", "Available": "500"},
        { "Account": "HHH- 5210", "Available": "600"},
    ];

    $scope.sorted = $scope.empList.sort((a, b) => a.Account.match(/\d+/) - b.Account.match(/\d+/));    
}]);

<script src="//code.angularjs.org/snapshot/angular.min.js"></script>

<div ng-app='app' ng-controller='MyController'>
  <h3>Sorted using ng-repeat:</h3>
  <input type='button' value='{{"Sort by " + (reverse ? "ascending" : "descending")}}' ng-click='reverse=!reverse'/>
  <ul >
     <li ng-attr-temp='{{item.temp = item.Account.match("\\d+")}}' ng-repeat='item in empList | orderBy: "temp": reverse'>{{item.Account}} : {{item.Available}}</li>
  </ul>
  
  <h3>Static sorting through sort function:</h3>
  {{sorted}}
</div>

Answer 2

angular.module('app', [])
.controller('MyController', ['$scope', function($scope) {
    $scope.empList = [
        { "Account": "AAA - 0029", "Available": "$100" },
        { "Account": "BBB- 0146", "Available": "200" },
        { "Account": "AAA - 1812", "Available": "300"},
        { "Account": "CCC- 2019", "Available": "400"},
        { "Account": "FYC- 3810", "Available": "500"},
        { "Account": "HHH- 5210", "Available": "600"},
    ];

    $scope.sorted = $scope.empList.sort((a, b) => a.Account.match(/\d+/) - b.Account.match(/\d+/));    
}]);

<script src="//code.angularjs.org/snapshot/angular.min.js"></script>

<div ng-app='app' ng-controller='MyController'>
  <h3>Sorted using ng-repeat:</h3>
  <input type='button' value='{{"Sort by " + (reverse ? "ascending" : "descending")}}' ng-click='reverse=!reverse'/>
  <ul >
     <li ng-attr-temp='{{item.temp = item.Account.match("\\d+")}}' ng-repeat='item in empList | orderBy: "temp": reverse'>{{item.Account}} : {{item.Available}}</li>
  </ul>
  
  <h3>Static sorting through sort function:</h3>
  {{sorted}}
</div>

Answer 3

Answer №2

Give this code a try - I split the string using " " and sorted the numbers accordingly.

var  empList = [
        { "Account": "AAA - 0029", "Available": "$100" },
        { "Account": "CCC - 2019", "Available": "400"},
         { "Account": "BBB - 0146", "Available": "200" },
        { "Account": "FYC - 3810", "Available": "500"},
        { "Account": "AAA - 1812", "Available": "300"},
        { "Account": "HHH - 5210", "Available": "600"},
        ];
        
        
empList.sort(function(a,b){

var aNumber=a.Account.split(" ");
var bNumber=b.Account.split(" ");
return Number(aNumber[aNumber.length-1])-Number(bNumber[bNumber.length-1]);
});

console.log(empList);

Answer 4

Give this code a try - I split the string using " " and sorted the numbers accordingly.

var  empList = [
        { "Account": "AAA - 0029", "Available": "$100" },
        { "Account": "CCC - 2019", "Available": "400"},
         { "Account": "BBB - 0146", "Available": "200" },
        { "Account": "FYC - 3810", "Available": "500"},
        { "Account": "AAA - 1812", "Available": "300"},
        { "Account": "HHH - 5210", "Available": "600"},
        ];
        
        
empList.sort(function(a,b){

var aNumber=a.Account.split(" ");
var bNumber=b.Account.split(" ");
return Number(aNumber[aNumber.length-1])-Number(bNumber[bNumber.length-1]);
});

console.log(empList);

Answer 5

Answer №3

This code snippet demonstrates how to sort a list of accounts by their account number

accountList = [
        { "Account": "AAA - 0029", "Available": "$100" },
        { "Account": "BBB- 0146", "Available": "200" },
        { "Account": "AAA - 1812", "Available": "300"},
        { "Account": "CCC- 2019", "Available": "400"},
        { "Account": "FYC- 3810", "Available": "500"},
        { "Account": "HHH- 5210", "Available": "600"},
        ];
        
var sortedAccounts = accountList.sort(function(a,b) {
    var x = a.Account.split('- ')[1];
    var y = b.Account.split('- ')[1];
    return x < y ? -1 : x > y ? 1 : 0;
   });
   
console.log(sortedAccounts);

Answer 6

This code snippet demonstrates how to sort a list of accounts by their account number

accountList = [
        { "Account": "AAA - 0029", "Available": "$100" },
        { "Account": "BBB- 0146", "Available": "200" },
        { "Account": "AAA - 1812", "Available": "300"},
        { "Account": "CCC- 2019", "Available": "400"},
        { "Account": "FYC- 3810", "Available": "500"},
        { "Account": "HHH- 5210", "Available": "600"},
        ];
        
var sortedAccounts = accountList.sort(function(a,b) {
    var x = a.Account.split('- ')[1];
    var y = b.Account.split('- ')[1];
    return x < y ? -1 : x > y ? 1 : 0;
   });
   
console.log(sortedAccounts);

Answer 7

Answer №4

To extract the last numerical characters from a string, you can utilize a regular expression and employ an object to define the appropriate sorting function. It is recommended to encapsulate the sorting logic within a wrapper for descending order.

function sortBy(key, direction) {
    var sortFunctions = {
            Account: {
                asc: function (a, b) {
                    function getNumericValue(s) { return s.match(/\d+$/)[0]; }
                    return getNumericValue(a[key]) - getNumericValue(b[key]);
                },
            },
            Available: {
                asc: function (a, b) {
                    return a[key] - b[key];
                },
            }
        };
    return sortFunctions[key][direction || 'asc'] || function (a, b) { return sortFunctions[key].asc(b, a); };
}

var data = [{ Account: "AAA - 0029", Available: "1000" }, { Account: "BBB- 0146", Available: "200" }, { Account: "AAA - 1812", Available: "300" }, { Account: "CCC- 2019", Available: "400" }, { Account: "FYC- 3810", Available: "500" }, { Account: "HHH- 5210", Available: "600" }];

data.sort(sortBy('Account'));
console.log(data);

data.sort(sortBy('Account', 'desc'));
console.log(data);

data.sort(sortBy('Available'));
console.log(data);

data.sort(sortBy('Available', 'desc'));
console.log(data);

.as-console-wrapper { max-height: 100% !important; top: 0; }

Answer 8

To extract the last numerical characters from a string, you can utilize a regular expression and employ an object to define the appropriate sorting function. It is recommended to encapsulate the sorting logic within a wrapper for descending order.

function sortBy(key, direction) {
    var sortFunctions = {
            Account: {
                asc: function (a, b) {
                    function getNumericValue(s) { return s.match(/\d+$/)[0]; }
                    return getNumericValue(a[key]) - getNumericValue(b[key]);
                },
            },
            Available: {
                asc: function (a, b) {
                    return a[key] - b[key];
                },
            }
        };
    return sortFunctions[key][direction || 'asc'] || function (a, b) { return sortFunctions[key].asc(b, a); };
}

var data = [{ Account: "AAA - 0029", Available: "1000" }, { Account: "BBB- 0146", Available: "200" }, { Account: "AAA - 1812", Available: "300" }, { Account: "CCC- 2019", Available: "400" }, { Account: "FYC- 3810", Available: "500" }, { Account: "HHH- 5210", Available: "600" }];

data.sort(sortBy('Account'));
console.log(data);

data.sort(sortBy('Account', 'desc'));
console.log(data);

data.sort(sortBy('Available'));
console.log(data);

data.sort(sortBy('Available', 'desc'));
console.log(data);

.as-console-wrapper { max-height: 100% !important; top: 0; }

Answer 9

Answer №5

Here is a way to sort in descending order:

var newArr = empList.sort(function(prev, next) {
    var prevNum = parseInt(prev.Account.split('-')[1]);
    var nextNum = parseInt(next.Account.split('-')[1]);
    
    if (prevNum < nextNum) {
        return 1;
    } else if (prevNum > nextNum) {
        return -1;
    }
    
    return 0;
})

Answer 10

Here is a way to sort in descending order:

var newArr = empList.sort(function(prev, next) {
    var prevNum = parseInt(prev.Account.split('-')[1]);
    var nextNum = parseInt(next.Account.split('-')[1]);
    
    if (prevNum < nextNum) {
        return 1;
    } else if (prevNum > nextNum) {
        return -1;
    }
    
    return 0;
})

Arranging numbers in JavaScript lists

Answer №1

Answer №2

Answer №3

Answer №4

Answer №5

Similar questions

Updating website content dynamically using AJAX and URL manipulation without refreshing the page (Node.js)

I am attempting to create an API request that is dependent on the outcome of another API request by utilizing a forEach loop. Is there a different approach I could take to achieve the desired

The process of converting a data:image base64 to a blob is demonstrated in this code snippet

Angular page fails to refresh upon addition or deletion of data

Code for Custom Controllers in Strapi Beta version 3.0

I encountered no response when attempting to trigger an alert using jQuery within the CodeIgniter framework

Can a table with a checkered pattern be created in Ember.js with just Handlebars and ember-composable-helpers?

What seems to be the issue with the useState hook in my React application - is it not functioning as

Combining object properties from a collection of objects based on matching IDs in JavaScript

The span's onclick function seems to be malfunctioning

What is the process for managing items in an array within a separate file?

Trouble with Bootstrap 3's nav-justified feature not displaying correctly upon window expansion

Fetching Data Using Cross-Domain Ajax Request

Swap out a portion of HTML content with the value from an input using JavaScript

Best practices for effectively dismantling a Paper.js Scope

Just starting out with JS/jQuery and having trouble hiding a div as I thought it should (or revealing it incorrectly)

What is the best way to create a list using only distinct elements from an array?

In JavaScript, the function is unable to access elements within an iteration of ng-repeat

Enhancing socket.io with the incorporation of a variable

Solving SEO issues with jQuery load()