0

[EDIT: These are all great methods for changing the way I sort. However I can't change the sorting method, unless one of you knows how to do that. In my JS there is a very long sorting algorithm that I didn't write. I'm not really sure how I would edit it to incorporate any of these sorting methods. Hence why I asked for a way to make them sort alphabetically by just changing the strings themselves.]

I have a table that has a sort button and everything works except for 1 column.

How do I sort 6", 12", and 18"?

They sort in the order 6" 18" 12" because of the quotes. I dont really want to remove the quotes and specify in the header that it is measured in inches... and I dont want to put a 0 before the 6 (which would also work). Ideally I want to put a space before the 6, but that space gets ignored for sorting. Anyone have any thoughts?

My inputs are just defined in a simple array:

var paras1 = [
  ["K"],
  ["-270°C to 1372°C, –454°F to 2501°F"],
  ['0.125 (1/8")', '0.1875 (3/16")', '0.250 (1/4")'],
  ['6"', '12"', '18"'], //-------THE LINE THAT I CARE ABOUT-------
  ["316SS"],
  ["Grounded", "Ungrounded", "Exposed"],
];

Ive tried the following:

 [' 6"', '12"', '18"'] //with space doesnt work
 ['06"', '12"', '18"'] //with 0 works and looks ugly
 ['6', '12', '18']     //works but not what i want

If you have some creative characters that would help sort, you can try them out on line 486 if that helps, https://jsfiddle.net/msirkin/duw5nyqe/9/

Improve this question
11
  • 2
    Numbers should be agnostic to the unit of measurement. So, you SHOULD remove the " and sort it correctly as a number. If you really must keep the unit of measurement, then have it as a separate property of an object e.g. [{value:25, uom:'inches'}, {value:42, uom:'inches'}, {value:17, uom:'inches'}]. Then, sort by the value property and display the data according to the unit of measurement. Keep your data model and how it should be displayed in the UI separate. Commented Oct 28, 2016 at 14:20
  • 1
    You can remove the " while sorting. You don't have to do it permanently. Commented Oct 28, 2016 at 14:21
  • 1
    @ManoDestra what you're saying makes sense, but the problem is I'm using a js file to do the sorting that was written by someone else, and it's huge. That sounds like something I'd have to go through his file to figure out. If you look at my fiddle youll see how long the js is. That's why i was hoping for a simple solution that just changes the alphabetical order of the individual elements themselves. But maybe your right, that the easiest answer is just to remove the ", I just wanted them displayed in the table because thats how I see other sites like digikey and mcmaster do it Commented Oct 28, 2016 at 14:38
  • 1
    @MatthewSirkin Yes, the simplest, pragmatic approach would be to remove the ", at least for the sorting, and then display accordingly. You could create another model from the given model that maps the values to their string counterparts. Numerous ways of doing this, but the simplest is to remove the " for the sorting operation. Commented Oct 28, 2016 at 14:59
  • 1
    @MatthewSirkin Add the class sorttable_numeric to the column header cell (the one containing the text Length). I just tested it and that works. Commented Oct 28, 2016 at 15:26

2 Answers 2

Reset to default
1

Ensure strings are compared as numbers by setting a comparision function in the sort.

Maybe you have a better way of adding a class name to your table columns, but in your fiddle demo: https://jsfiddle.net/msirkin/duw5nyqe/9/ I added the 'sorttable_numeric' class programmatically for column Length, in line 622, right before eo_head_row.appendChild(headCell). You can add more params like this for other columns that need to be sorted numerically: (k == "para4" || k == "para5").

if (k == "para5") {headCell.className += ' sorttable_numeric';}
Improve this answer
Sign up to request clarification or add additional context in comments.

4 Comments

I don't really know how to change the sorting method of the js that I have. I didn't write it and it's quite long. Sorry for being unclear, I've edited my question to specify that I'm looking for a way to make my values be intrinsically alphabetically sortable as strings
In your fiddle, you need to add the class "sorttable_numeric" to the header column yo want to sort correctly (column "Length").
Remove the zero in 06", it's not a stable fix, i.e. If you have a 100" value, it will still be sorted as less than 12".
Updated the answer using your example.
1

You could use sorting with map and use the numerical values.

// the array to be sorted
var list = ['18"', '6"', '12"'];

// temporary array holds objects with position and sort-value
var mapped = list.map(function(el, i) {
    return { index: i, value: el.match(/\d+(?=")/) };
});

// sorting the mapped array containing the reduced values
mapped.sort(function(a, b) {
    return a.value - b.value;
});

// container for the resulting order
var result = mapped.map(function(el){
    return list[el.index];
});

console.log(result);

Or use sort directly with the numerical values.

// the array to be sorted
var list = ['18"', '6"', '12"'];

list.sort(function(a, b) {
    function getNumber(s) { return s.match(/\d+(?=")/); }
    return getNumber(a) - getNumber(b);
});

console.log(list);

Improve this answer

1 Comment

Both of these make sense, but I don't really know how to change the sorting method of the js that I have. I didn't write it and it's quite long. Sorry for being unclear, I've edited my question to specify that I'm looking for a way to make my values be intrinsically alphabetically sortable as strings

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.