JQuery сортировка DIVS часть II

Question

В предыдущем вопросе Я спросил, как сортировать div по 2 параметрам: имя или значение, asc или desc.Я написал весь код с полученной идеей, и я решил все, кроме двух последних проблем.

Это то, что я делаю ... Чтобы отсортировать div, сначала я объединяю значения и id и получаюмассив, подобный этому:

window.sortval = ["76#box1", "71#box122", "125#box4"];

(я использую окно. чтобы убедиться, что он находится в глобальной области видимости). Первая часть - это числовое значение, по которому я хочу отсортировать, а вторая - идентификатор DIV.

ВОПРОС 1: если я запускаю

window.sortval.sort(function(a,b){return a - b})

, он не сортируется.

- Чтобы продолжить эксперимент, я использовал консоль браузера и отсортировал массиврукой.Теперь у меня есть второй вопрос.Код, который я собирался использовать для настоящей сортировки, не работает:

У меня есть

<div id="container">
    <div class="sortable" id="box1" rel="76" data-rel="Name One">
        [some inside html including a table and divs]
    </div>
    <div class="sortable" id="box122" rel="71" data-rel="Name Two">
        [some inside html including a table and divs]
    </div>
    <div class="sortable" id="box4" rel="125" data-rel="Name Three">
        [some inside html including a table and divs]
    </div>
</div>

, а затем, когда я запускаю

//get only the id part of each value in the array
var ids = $.map( window.sortname, function(val, i) {
  return val.substring(val.indexOf('#'));
}); 

//sort the DOM
var cont = $('#container');
    $.each(ids, function(i, v) {
    cont.append($(v));
});

Ничего не происходит, даже не ошибка

Answer 1

Если вам не нужен массив для чего-то другого, он отсортирует ваши .sortable деления и поместит их в #container:

var sorted = $(".sortable").sort(function(a,b) {
    return $(a).attr("rel") - $(b).attr("rel");
});
var cont = $("#container");
$.each(sorted,function(i,el) {
    cont.append(el);
});

http://jsfiddle.net/Gx5qw/

Answer 2

Это выглядит как довольно окольный способ сортировки по двум ключам. Вы должны иметь возможность использовать стандартный sort() с пользовательской функцией сортировки.

Вот один из способов сделать это, сначала отсортировав атрибут rel, а затем id:

var cnt = $("#container");
var sorted = $(".sortable", cnt).sort(function(a, b) {
    // (optional), cache vars so we don't keep calling $(...)
    var $a = $(a), $b = $(b);
    var a_id = $a.attr("id"), b_id = $b.attr("id");
    var a_rel = $a.attr("rel"), b_rel = $b.attr("rel");

    if (a_rel == b_rel) { // if rel equal, sort by id
        return (a_id > b_id) ? 1 : (a_id < b_id) ? -1 : 0; // String comparison
    } else {
        return a_rel - b_rel; // Numeric comparison
    }
});

// reinsert in sorted order
$.each(sorted, function(i, e) { cnt.append(e); }); 

Демо: http://jsfiddle.net/8F9Uv/

Answer 3

Это то, что вам нужно ..

window.sortval = ["76#box1", "71#box122", "125#box4"];


// sort based on the numeric value before the id
window.sortval.sort(function(a,b){
   return a.substring(0, a.indexOf('#')) - b.substring(0, b.indexOf('#'));
}); 

//sort the DOM based on the ordered array by using the ids
var cont = $('#container');
    $.each(window.sortval, function(i, v) {
    cont.append($( v.substring(v.indexOf('#')) ));
});

демо на http://jsfiddle.net/Wdybs/1/