Having trouble with javascript sort() order

Question

This is my html code for that I put in an array to sort. I am trying to get the numbers to sort in order from the lowest to the highest (in the ids). But all my code seems to do is resort from top to bottom while maintaining the current order. Having looked around and trying a few different methods, I have not found a solution as of yet. Any suggestions?

<a href="#" class="link-sort-list asc">A-Z</a> <a href="#" class="link-sort-list desc">Z-A</a>
<ul id="sortable">
<li id="220" class="p_box"></li>
<li id="221" class="p_box"></li>
<li id="217" class="p_box"></li>
<li id="215" class="p_box"></li>
<li id="219" class="p_box"></li>
<li id="216" class="p_box"></li>
<li id="218" class="p_box"></li>
<li id="214" class="p_box"></li>
<li id="208" class="p_box"></li>
<li id="206" class="p_box"></li>
</ul>

This is my javascript sort function. The issue might be here but I am not sure.

var $list = $('#sortable');
var $myId = [];
var $myId = $(".p_box");
 //Sort Click Buttons
    $('.link-sort-list').click(function(e) {
    if ($(this).hasClass('asc')){
    $list.empty().append($myId.sort(function(a,b){return a < b}));
    } else {
    $list.empty().append($myId.sort());
    }
    e.preventDefault();
    });

See the documentation for sort(); your callback is wrong.

SLaks
– SLaks

2014-04-06 21:49:38 +00:00
Commented Apr 6, 2014 at 21:49 — SLaks
– SLaks, Commented Apr 6, 2014 at 21:49

adeneo · Accepted Answer · 2014-04-06 22:15:04Z

1

You have to sort by ID, and to sort the other way, reverse the condition

var $list = $('#sortable');

$('.link-sort-list').click(function(e) {
    e.preventDefault();
    if ($(this).hasClass('asc')) {
        $list.find('li').sort(function(a, b) {
            return a.id - b.id;
        }).appendTo($list);
    } else {
        $list.find('li').sort(function(a, b) {
            return b.id - a.id;
        }).appendTo($list);
    }
});

FIDDLE

answered Apr 6, 2014 at 22:15

adeneo

319k29 gold badges410 silver badges392 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Amir Over a year ago

Ah I get it now. Before I was sorting just the list itself in the current order but not sorting by the id which with your interpretation makes it do that. Thank you very much. Really appreciate that assistance.

royhowie · Accepted Answer · 2014-04-06 22:33:13Z

1

I would do something like this:

$("#clickme").click(function(){
    var holder = [];

    $("#sortable").find("li").each(function(){
        holder.push($(this).attr("id"));
    });
    holder.sort();

    var length = holder.length, i = 0, k = 0;
    for (; i < length; i++){
        holder[i] = $("#" + holder[i]);
    }

    $("#sortable").children().remove();

    for (var k = length - 1; k > -1; k--){
        holder[k].insertAfter($("#sortable"));
    }
})

answered Apr 6, 2014 at 22:33

royhowie

11.2k14 gold badges54 silver badges67 bronze badges

2 Comments

Amir Over a year ago

Interesting approach. Would that also be able to work with associative arrays?

royhowie Over a year ago

I believe so, but it would require a slightly different setup under the .each() block.

NSF · Accepted Answer · 2014-04-06 21:53:48Z

0

I don't see where $list and $myId come from but the function in sort should be:

return a - b;

answered Apr 6, 2014 at 21:53

NSF

2,5596 gold badges32 silver badges57 bronze badges

Collectives™ on Stack Overflow

Having trouble with javascript sort() order

3 Answers 3

1 Comment

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related