我如何首先对一个值进行排序，而不对另一个进行排序？

Question

This is my code :

<div id="fascia-filtri-etichette">
    <div data-title="m" data-preorder="order-2" class="item">m</div>    
    <div data-title="2013" data-preorder="order-3" class="item">2013</div>    
    <div data-title="2012" data-preorder="order-3" class="item">2012</div>
    <div data-preorder="order-4" id="fascia-filtri-etichette-cancella">DELETE</div>
    <div data-title="E" data-preorder="order-1" class="item">E</div>
    <div data-title="S" data-preorder="order-1" class="item">S</div>
    <div data-title="2014" data-preorder="order-3" class="item">2014</div>
</div>

<script>
    var items = $("#fascia-filtri-etichette" + ' > div');
    items.sort(function (a, b) {
        return a.getAttribute('data-title') > b.getAttribute('data-title') || a.getAttribute('data-preorder') > b.getAttribute('data-preorder');
    }).detach().appendTo($("#fascia-filtri-etichette"));    
</script>

and I'd like to order (ascending) the divs first for the pre-order field, than (thus for each previous block) for title.

The result should be:

E // order 1
S // order 1
m // order 2
2012 // order 3
2013 // order 3
2014 // order 3
DELETE // order 4

Where am i wrong?

Answer 1

Your mistakes here are

1. Sorting function should -1 or 0 or 1 , not true / false
2. Code is messy and it is not easily checkable to get how it works. I didn't get how you combine title sorting and pre - order, and probably mistake is here

it should look like this

items.sort(function (a, b) {
    var po = a.getAttribute('data-preorder').localeCompare(b.getAttribute('data-preorder'));
    if(po != 0) return po;

    return a.getAttribute('data-title').localeCompare( b.getAttribute('data-title'));
});

First it should go and check preorder, only then compare title. Here is working example http://jsfiddle.net/rczjm4ph/

Answer 2

Use 2 sort functions instead of one. The testcase http://jsfiddle.net/a47xv32f/

var items = $("#fascia-filtri-etichette" + ' > div');
items.sort(function (a, b) {
    return a.getAttribute('data-title') > b.getAttribute('data-title');
}).sort(function (a, b) {
    return a.getAttribute('data-preorder') > b.getAttribute('data-preorder');
}).detach().appendTo($("#fascia-filtri-etichette"));    

Answer 3

It is still can be done with a single sort() :

var items = $("#fascia-filtri-etichette" + ' > div');
items.sort(function (a, b) {
    var cmpOrder = a.getAttribute('data-preorder').localeCompare(b.getAttribute('data-preorder'));

    if (cmpOrder !== 0) return cmpOrder;

    return a.getAttribute('data-title').localeCompare(b.getAttribute('data-title'));
});    

Answer 4

Make a comparison function that looks at the pre-order first, then the title for items where pre-order are equal:

items.sort(function (a, b) {
  var aPre = a.getAttribute('data-preorder');
  var bPre = b.getAttribute('data-preorder');
  if (aPre == bPre) {
    return a.getAttribute('data-title') > b.getAttribute('data-title') ? 1 : -1;
  } else {
    return aPre > bPre ? 1 : -1;
  }
}).detach().appendTo($("#fascia-filtri-etichette"));