Sorting array based on custom priority of one attribute

Question

I'm using jQuery to parse a JSON file of employees, which contains their name, department, subdepartment, and some other details.

e.g.:

[
{
  "LAST":"Betsy",
  "FIRST":"Jackson",
  "DEPT":"Customer Service",
  "SUBDEPT":"Tech Support",
  "JOINED":"02/94",
  "TITLE":"Technical Customer Service Representative",
  "RESIDENCE":"Someplace",
  "HOBBIES":"Reading, Walking, Sleeping"
},
{
  "LAST":"Sally",
  "FIRST":"Smith",
  "DEPT":"Customer Service",
  "SUBDEPT":"Installation Customer Service Representative",
  "JOINED":"01/04",
  "TITLE":"Technical Customer Service Representative",
  "RESIDENCE":"Someplace",
  "HOBBIES":"Reading, Walking, Sleeping"
},
]

I'm trying to build an application where users can click on the name of an employee and see a refresh of results where every employee in that employee's department is shown, organized by the sub-departments, and scrolled-down to the given employee.

I've successfully generated a list of employee names, with data-* attributes to hold their department and sub-department. When an employee name is clicked, I've been able to parse the JSON file a second time return all the employees who are also in that department, and build a grid, and then push the entire matching employee object into a new array called "results."

note: dept = data-dept passed by jquery selector..

$.each(data, function(i, employee) { 
    if (employee.DEPT == dept) {
    var employeetext = '<span class="name">'
     + employee.FIRST+' '+ employee.LAST+'</span>',
     employee.JOINED, 
     employee.TITLE, 
     employee.RESIDENCE, 
     '...', 
     employee.HOBBIES;  

        $('#employees').append('<div class="employee_block"><img src="" width="85" height="113">' + employeetext + '.</div>');  

        results.push(employee); 
}
}) // end stepping through employees

However, I need to build the grid based on a new sorted order from the array, rather than y the alphabetical that is being used now. I need to split the results by sub-department, according to a priority that is not alphabetical, but rather a custom order which I'm hoping to define in a separate object (would this be a "relational database?") e.g:

var subdeptorder =  [
{
    "DEPT": "Marketing",
    "SUBDEPTS": ["Administration", "Purchasing", "Advertising", "PR"]
},
{
    "DEPT": "Sales",
    "SUBDEPTS": ["Administration", "Business Development"]
}
]

So I need to sort the "results" array according to the employee's department (and that department's subdepartment order) within it.

How do I write a comparison function to re-sort the "results" array according to a priority established in a separate object?

use .sort and reference the separate object in the logic that returns -1 0 or 1 relative to the nodes currently being sorted. — Kevin B, Aug 28 '13 at 21:34
Thanks. I should mention this will be my first time using .sort at all, so any addl. guidance is appreciated! — AT Design, Aug 28 '13 at 21:40
@JonathanLonowski: If at all, it's a duplicate of [Sorting on a custom order](http://stackoverflow.com/questions/14872554/sorting-on-a-custom-order)! — Bergi, Aug 28 '13 at 21:49

score 2 · Accepted Answer · edited May 23 '17 at 12:29

2

Format the separate object like this:

var subdeptorder = {
    "Marketing": ["Administration", "Purchasing", "Advertising", "PR"],
    "Sales": ["Administration", "Business Development"]
};

Then you can sort the data like so:

var dept = …; // the chosen one

var results = $.grep(data, function(employee) {
        return employee.DEPT = dept;
    }),
    order = subdeptorder[dept];
results.sort(function(a, b) {
    // sort them by the indices of their SUBDEPTs in the order array
    return $.inArray(a.SUBDEPT, order) - $.inArray(b.SUBDEPT, order);
});
$.each(results, function(i, employee) { 
     $('#employees').append('<div class="employee_block"><img src="" width="85" height="113">' + [
         '<span class="name">'+employee.FIRST+' '+employee.LAST+'</span>',
         employee.JOINED,
         employee.TITLE,
         employee.RESIDENCE,
         '…',
         employee.HOBBIES
     ].join(' ') + '.</div>');
});

See Sorting on a custom order for an optimised version (not using $.inArray for the index every time).

edited May 23 '17 at 12:29

Community

1
1

answered Aug 28 '13 at 21:46

Bergi

630,263
148
957
1,375

I only want to return employee.DEPT = dept if they match, so I wrapped that in a conditional. But this is still printing them in alphabetical order *after* the first employee. I can't figure out how it's picking the first employee just yet, with the above code. I set up my deptorder array (calling it deptorder now since it assigns dept and subdept order), it just doesn't seem to be using it yet. (also, comma needed after employee.TITLE) – AT Design Aug 28 '13 at 22:30
I can tell "order" is right, because I can see it in log.. but the results array is not being sorted according this. It's still printing them according to the alphabetical order of the employees last name. – AT Design Aug 28 '13 at 23:44
The [filtering](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter) condition is done by `grep`, which is independent from the sorting task. Thanks for spotting the missing comma. My mistake was confusing the odd parameter order of [`$.inArray`](http://api.jquery.com/jQuery.inArray), I should've used the [native `indexOf` method](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/indexOf) better. Should be fixed now. – Bergi Aug 28 '13 at 23:54
Fixing the order of parameters in inArray did the trick for separating my sub-sections by priority set in my subdeptorder object. THANKS! For some reason I still need to wrap the return inside grep with a conditional in order to return only employees whose department is the same as the department of the employee selected. But this gets me by! – AT Design Aug 28 '13 at 23:59
I will need to do another round of this and order the employees within each subsection according to either a priority set in the JSON or by another separate object. Not sure if that warrants another question on stack (if I get stuck) or if I can roll it into this question? – AT Design Aug 29 '13 at 00:00

Sorting array based on custom priority of one attribute

1 Answers1