catonthecouchproductions
asked on
jQuery - Sort div's on click
I am trying to make the boxes on this page sort: http://dws.commercegeneration.com:85/Shades.aspx
I think I almost have it, but I have it appending to each section. What other ways can I sort the divs by the price.
Right now I have only the "sort from low to high" - that is the only working link.
I think the code I have is a start.
Thanks,
Ryan
I think I almost have it, but I have it appending to each section. What other ways can I sort the divs by the price.
Right now I have only the "sort from low to high" - that is the only working link.
I think the code I have is a start.
Thanks,
Ryan
$(function () {
function reorder(sortby, direction){
Array.prototype.sort.call($("div.shade-box"), function(a,b){
var av = $(a).find("span."+sortby).text();
var bv = $(b).find("span."+sortby).text();
return direction=="ascending"? av-bv : bv-av;
}).appendTo(".shade-listing");
}
$('.sort-low-high').toggle(function() {
reorder("shade-price-wrap","ascending");
/*
$(this).html("Close box");
*/
}, function() {
reorder("shade-price-wrap","descending");
/*
$(this).html(saveText);
*/
});
});
ASKER
Hey,
I am now working with the code below in the box. I made some changes to the code seen in the demo, on the click event:
http://qd9.co.uk/projects/jQuery-Plugins/sort/demo.html
My markup looks like this: http://pastie.org/1168658
I made it look for the <span> that holds the price and sort by that. Any suggestions?
I am now working with the code below in the box. I made some changes to the code seen in the demo, on the click event:
http://qd9.co.uk/projects/jQuery-Plugins/sort/demo.html
My markup looks like this: http://pastie.org/1168658
I made it look for the <span> that holds the price and sort by that. Any suggestions?
var sortDiv = jQuery('.shade-box'),
inverse = false;
$('.sort-low-high').click(function(){
sortDiv.sort(function(a, b){
console.log(a);
return $(a).next('.shade-price-wrap').text() > $(b).next('.shade-price-wrap').text() ? 1 : -1;
});
});
ASKER
Would it matter if I am sorting by INT and not alphabetical?
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Thanks! let me try this. Sorry for the delay.
Ryan
Ryan
ASKER
Good eye! Thank you for that.
Ryan
Ryan
http://james.padolsey.com/javascript/sorting-elements-with-jquery/