JQuery: Sorting JSON results

JQuery. Write less, do more

This is a follow up to a previous post on sorting elements using JQuery. A few people messaged me asking how to modify the code to sort JSON results from a ajax request so here it goes.

The JSON (json.php):

[{"id":600385,"name":"Featured Titles","url":
    "http://www.example.com"},
  {"id":562680,"parentId":567182,"name":"Business","url":
    "http://www.example.com"},
  {"id":562677,"parentId":567186,"name":"Other Misc.","url":
    "http://www.example.com"},
  {"id":562664,"parentId":567186,"name":"News \u0026 History","url":
    "http://www.example.com"},
  {"id":562678,"parentId":567186,"name":"Men\u0027s General","url":
    "http://www.example.com"},
  {"id":562685,"parentId":567182,"thumbnailUrl":
    "http://www.example.com","name":
    "Animals","url":
    "http://www.example.com"},
  {"id":562679,"parentId":567189,"name":"Travel","url":
    "http://www.example.com"},
  {"id":562672,"parentId":567186,"name":"Outdoor Activities","url":
    "http://www.example.com"},
  {"id":562690,"parentId":567186,"name":"Music","url":
    "http://www.example.com"},
  {"id":562695,"parentId":567186,"name":"Military","url":
    "http://www.example.com"},
  {"id":562669,"parentId":567183,"name":"Entertainment","url":
    "http://www.example.com"},
  {"id":562688,"parentId":567182,"name":"Computers","url":
    "http://www.example.com"},
  {"id":562694,"parentId":567183,"name":"Electronics","url":
    "http://www.example.com"},
  {"id":562675,"parentId":567183,"name":"Games \u0026 Puzzles","url":
    "http://www.example.com"},
  {"id":562682,"parentId":567183,"name":"Fishing \u0026 Hunting","url":
    "http://www.example.com"},
  {"id":562681,"parentId":567183,"name":"Family","url":
    "http://www.example.com"}]

We’re going to sort these results by the ‘name’ field and apply them to a ul list. First save the above JSON to your server and call it json.php.

The HTML/JS:


	
	
	
	
	
		
	

That’s it! After you save the above html to your server, you should see a case-insensitive sorted list of names from your JSON file in your list. If you want to sort using another attribute besides name just modify the sortJsonName() function.

, ,