Sorting Divs With JQuery Based On "data-" Attribute

Question

I'm trying to sort divs using jquery based on it's data-enter attribute. Here's my JQuery for it:

            let result = $("#tableEls .dataDiv").sort(function (a, b) {
                console.log(+$(a).data("enter") + " < " + +$(b).data("enter"));
                return +$(a).data("enter") < +$(b).data("enter");
            }).appendTo("#tableEls");

            console.log(result);

However, when this is called, it doesn't reorder the divs. Here are the divs:

Also, here's the console output:

I've tried many different solutions on StackOverflow but can't find any that work for me. I'm not sure if I'm doing something wrong but I can't see anything wrong.

Also, here's the screenshot of the HTML page itself with each of the four divs outlined with a black border:

When the Sort Rows button is clicked, the enter cell from each table and adds it as the data-enter attribute for each div before running the JQuery from above. So in this example, the first and second div's positions should be swapped.

The sort function should return 0 if the values are equal, a value greater than 0 if the first argument is greater than the second, and a value less than 0 if the first argument is less than the second. The sort function provided returns a Boolean. Typically, if the arguments are numbers, returning the equivalent of a - b is enough to sort them. — Heretic Monkey
– Heretic Monkey, Commented Aug 24, 2020 at 12:17

Marc Gardent · Accepted Answer · 2020-08-24 12:20:19Z

1

your sort function have to return N or -N or 0 not a boolean:

let result = $("#tableEls .dataDiv").sort(function (a, b) {
            console.log(+$(a).data("enter") + " - " + +$(b).data("enter"));
            return +$(a).data("enter") - +$(b).data("enter");
        }).appendTo("#tableEls");

        console.log(result);

answered Aug 24, 2020 at 12:20

Marc Gardent

463 bronze badges

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

Collectives™ on Stack Overflow

Sorting Divs With JQuery Based On "data-" Attribute

1 Answer 1

Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Related