Sorting of lists in jQuery

nospam@example.com (Mark van der Velden) — Tue, 06 Oct 2009 13:00:00 +0200

A while back I posted a simple sorting algorithm for number sorting, but it doesn't really do the trick for regular strings (e.g. anchors). But since I needed one recently I wrote another small and very simple sorting solution.

For a working example, see: http://dynom.nl/jquery/listsort.php

My.List = {
Sort : function (listSelector) {
var sortedElements, left, right;

// If we have any list items to sort on
if ($(listSelector + ' li').length > 0) {

// Remove the items from the DOM
sortedElements = $(listSelector + ' li').remove();

// Sort, using a custom sorting and compare by anchor contents
sortedElements.sort(function (a, b) {
left = $(a).children('a').html();
right = $(b).children('a').html();

if (left > right) {
return 1;
} else if (right < left) {
return -1;
} else {
return 0;
}
});

// Place the items back on the DOM
$(listSelector).append(sortedElements);
}
}
};

Again, the source should be self explanatory

Javascript unordened list sorting

nospam@example.com (Mark van der Velden) — Mon, 11 May 2009 15:19:35 +0200

I spent some time figuring out a way to sort unordened lists, when dynamically (AJAX) adding/removing items. I had some problems with the typical '10 being greater then 1, but lesser then 2', so I took a simple bubblesort algorithm and tweaked it with the string length. It's probably not the fastest or most elegant way of doing it, but it works like a charm. If you have any improvement points, don't be shy and drop a line.

The algorithm:
This is the search algorithm I used, (which I found here) and I simply added the difference in string length to the equation to make sure that '10' is greater then '1', causing human-natural sorting.

// Search algorithm, if lesser then 0 it's smaller then the current item.
// If it's greater then 0, it's "larger" then the current item.
cmpr = (
(newItem > curListItem) - (curListItem > newItem)
+
(newItem.length - curListItem.length)
);

Before: Title 1, Title 10, Title 13, Title 2, Title 3, Title 4
After: Title 1, Title 2, Title 3, Title 4, Title 10, Title 13

Read on to see a implementation example...

Continue reading "Javascript unordened list sorting"

D-talk (Entries tagged as ul)

Sorting of lists in jQuery

Javascript unordened list sorting