Sort content alphabetically

Question

So, after an AJAX call, I add the following, and this AJAX call can happen several times, returning multiple data items. And I'm trying to use Tinysort [ http://plugins.jquery.com/project/TinySort] to sort the list every time, so the added new items are perfectly combined and sorted alphabetically.

Unfortunately, it does not seem to work. Any ideas? I mean, the data itself is correctly added, but, unfortunately, sorting does not occur.

var artists = []; $.each(data.artists, function(k, v) { artists.push('<section id="artist:' + v.name + '" class="artist"><div class="span-9"><img alt="' + v.name + '" width="34" height="34" class="photo" src="' + v.photo + '" /><strong>' + v.name + '</strong><br/><span>' + v.events + ' upcoming gig'); if (v.events != 1) { artists.push('s'); } artists.push('</span></div><div class="span-2 align-right last">Last</div><div class="clear"></div></section>'); }); $('div.artists p').remove(); $('div.artists div.next').remove(); $('div.artists').append(artists.join('')).append('<div class="next"><a href="#">Next</a></div>'); $('div.artists section').tsort('section[id]', {orderby: 'id'}); 

Thanks!

Answer 1

I suggest sorting the data on the server side. Not sure what a data source is, but in most cases it is much easier to move the sorting logic to the server.

When sorting in Javascript, you may run into problems in different browsers when your data will contain characters other than ascii (some browsers may sort such data, and some will not). This leads to different behaviors between browsers, which I think is not expected.