How to sort div's by content date
I'm trying to sort div's by content date... What i've got is sorting. But not by date...
HTML
<div id="all_elements">
<!-- one element -->
<div class="element">
<div class="display-number">02</div>
<div class="year">20-10-2011</div>
</div><!-- element -->
<!-- one element -->
<div class="element">
<div class="display-number">03</div>
<div class="year">22-09-2011</div>
</div><!-- element -->
<!-- one element -->
<div class="element">
<div class="display-number">01</div>
<div class="year">01-12-2011</div>
</div><!-- element -->
<!-- one element -->
<div class="element">
<div class="display-number">04</div>
<div class="year">01-06-2011</div>
</div><!-- element -->
<!-- one element -->
<div class="element">
<div class="display-number">05</div>
<div class="year">01-06-2010</div>
</div><!-- element -->
开发者_如何学Go </div> <!--all_elements-->
JQUERY
<script>
function sortDescending(a, b) {
return $(a).find(".year").text() < $(b).find(".year").text() ? 1 : -1;
};
$(document).ready(function() {
$('#all_elements .element').sort(sortDescending).appendTo('#all_elements');
});
</script>
I know i need a function to figure out the content is a date.. Just don't know how...
Who can help me out?
You could do:
function sortDescending(a, b) {
var date1 = $(a).find(".year").text();
date1 = date1.split('-');
date1 = new Date(date1[2], date1[1] -1, date1[0]);
var date2 = $(b).find(".year").text();
date2= date2.split('-');
date2= new Date(date2[2], date2[1] -1, date2[0]);
return date1 < date2 ? 1 : -1;
};
$(document).ready(function() {
$('#all_elements .element').sort(sortDescending).appendTo('#all_elements');
});
EDIT - corrected the typo according to the comment! Fiddle here http://jsfiddle.net/TsZeg/
did you try the date object: new Date($('.year').text())
?
Use my jquery plugin SortContent :
$('#all_elements').sortContent({asc:true})
But , as your sort a based on something distinct of String (Date) , you should use format
callback.
And, As the Date is not the whole HTML of elements to sort , you should use helper
callback to identify the suitable content.
$('div#all_elements').sortContent({format:parser,helper:myhelper})
Required callbacks :
parser=function(content){
content=content.split('-');
//Convert 20-10-2011 to 10/20/2011 to be ready to Date parsing
content=content[1]+'/'+content[0]+'/'+content[2]
return Date.parse(content)
};
myhelper=function(e){
return $('.year',$(e)).html();
}
DEMO :
http://jsfiddle.net/abdennour/E4Hbp/8/
精彩评论