sort divs based on dates - javascript

Question

I have divs with data attribute data-submit-date and i want to sort them based on the value of this attribute which is date format.

here's the code for one of the divs:

<div class="article" data-submit-date="2017-09-12T05:45:36.951Z">
     <h1>aaaaA</h1>
</div>

my attempts:

$divss = $(".article");
    var alphaOrderDivs = $divss.sort(function (a, b) {
    return $(a).data("submit-date") > $(b).data("submit-date"); 
});
$(".articles").html(alphaOrderDivs);

I replaced this line $(a).data("submit-date") with Date.parse($(a).data("submit-date")) but it fails. Can anyone help me?

Thank In Advance

Possible duplicate of How to sort div's by content date

Aref Ben Lazrek
– Aref Ben Lazrek

2018-03-04 02:34:02 +00:00
Commented Mar 4, 2018 at 2:34 — Aref Ben Lazrek
– Aref Ben Lazrek, Commented Mar 4, 2018 at 2:34

Sam · Accepted Answer · 2018-03-04 02:34:03Z

1

Try the following

var articles = $.makeArray($(".article"));
articles.sort(function(a, b) {
   return new Date($(a).data("submit-date")) < new Date($(b).data("submit-date"));
});

Snippet

var articles = $.makeArray($(".article"));
    articles.sort(function(a, b) {
       return new Date($(a).data("submit-date")) < new Date($(b).data("submit-date"));
    });
    console.log(articles);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="article" data-submit-date="2017-09-10T05:45:36.951Z">
     <h1>aaaaA</h1>
</div>
<div class="article" data-submit-date="2017-09-12T05:45:36.951Z">
     <h1>aaaaA</h1>
</div>
<div class="article" data-submit-date="2017-09-11T05:45:36.951Z">
     <h1>aaaaA</h1>
</div>

answered Mar 4, 2018 at 2:34

Sam

2,9601 gold badge20 silver badges26 bronze badges

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

Comments

Gopalkrishna Narayan Prabhu · Accepted Answer · 2018-03-04 02:36:06Z

0

Use the getTime() method as follows:

 $divss = $(".article");
 var alphaOrderDivs = $divss.sort(function (a, b) {
   return new Date($(a).data("submit-date")).getTime() > new Date($(b).data("submit-date")).getTime(); 
 });
 $(".articles").html(alphaOrderDivs);

The getTime() method of the Date object will parse your time into milliseconds and will hence help you compare them.

edited Mar 4, 2018 at 2:36

answered Mar 4, 2018 at 2:33

Gopalkrishna Narayan Prabhu

6796 silver badges8 bronze badges

1 Comment

Sam Over a year ago

Yes you can compare Date objects

Collectives™ on Stack Overflow

sort divs based on dates - javascript

2 Answers 2

Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related