Skip to main content

Sorting an array of objects using Javascript

 When working on one of my projects, I had to sort the elements of the JSON array of objects. I did this most of the time from server side but this time I had to do the client side sort.

Here is the solution what I found.

We've two functions one to sort by ascending and other for descending. It expects first parameter as array (of objects) and second parameter the key on basis of which we want to sort.

 
<script>
function sortByKeyDesc(array, key) {
	return array.sort(function (a, b) {
    	var x = a[key]; var y = b[key];
        return ((x > y) ? -1 : ((x < y) ? 1 : 0));
	});
}

function sortByKeyAsc(array, key) {
	return array.sort(function (a, b) {
    	var x = a[key]; var y = b[key];
        return ((x < y) ? -1 : ((x > y) ? 1 : 0));
	});
}
</script>
Here is the example

<script>
books = [{
  'BookID': 123,
  'BookName': 'Seven Habits of most effective people'
}, {
  'BookID': 234,
  'BookName': 'Why Leaders eat last'
}, {
  'BookID': 345,
  'BookName': 'How to influence people'
}, {
  'BookID': 456,
  'BookName': 'The Tipping point'
}];

sorted_books = sortByKeyAsc(books, 'BookName');
console.log(sorted_books);
</script>
Result will be

[{
  BookID: 345,
  BookName: "How to influence people"
}, {
  BookID: 123,
  BookName: "Seven Habits of most effective people"
}, {
  BookID: 456,
  BookName: "The Tipping point"
}, {
  BookID: 234,
  BookName: "Why Leaders eat last"
}]

Comments

Popular posts from this blog

PHP script to upload file securely

How to Write a Secure PHP Script for File Uploads File uploads are a common feature in web applications, but they can introduce significant security risks if not handled properly. In this article, we'll walk through the steps to securely upload files to a server using PHP. We'll cover key security measures such as file validation, limiting file types, setting file size limits, and managing file storage. We will also create reusable functions to handle the upload process. 1. Create the HTML Form First, we need an HTML form that allows users to select and upload a file. Ensure that the form uses the POST method and includes the enctype="multipart/form-data" attribute. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Secure File Upload</title> </head> <body> <form action="upload.php" method="post" enctype="multipart/...

PHP Code Review Guidelines

General  The code works  The code is easy to understand  Follows coding conventions  Names are simple and if possible short  Names are spelt correctly  Names contain units where applicable  There are no usages of magic numbers  No hard coded constants that could possibly change in the future  All variables are in the smallest scope possible  There is no commented out code  There is no dead code (inaccessible at Runtime)  No code that can be replaced with library functions  Variables are not accidentally used with null values  Variables are immutable where possible  Code is not repeated or duplicated  There is an else block for every if clause even if it is empty  No complex/long boolean expressions  No negatively named boolean variables  No empty blocks of code  Ideal data structures are used  Constructors do not accept null/none values  Catch clause...

Multiple Checkboxes Validation

This is a regular problem and solution is hardly available on google. When we use multiple checkboxes of same group (same name with square brackets) and you've to read the values from server side, then below solution will help you. Here I'm using jQuery (https://jquery.com/) and jQuery Validate plugin (https://jqueryvalidation.org/) For an example, I've to ask a user which of the listed book they are interested to know about <form id="BooksForm" method="post" name="BooksForm"> <p>Books you are interested in </p> <input class="Books" id="Book1" name="Books[]" type="checkbox" value="1" /> The Inner Game of Tennis <br /> <input class="Books" id="Book2" name="Books[]" type="checkbox" value="1" /> Monk who sold his ferrari <br /> <input class="Books" id="Book3" name=...