Apologies if this has been asked before, but I can't seem to find a concise answer and I'm a rather light developer in jQuery.
I have a stack of objects which contain a variety of tags as class, including color and date as long-form number:
<div class="red sysdate20110712"></div>
<div class="blue sysdate20110712"></div>
<div class="blue sysdate20120314"></div>
<div class="red sysdate20110712"></div>
<div class="yellow sysdate20100813"></div>
<div class="red sysdate20100813"></div>
<div class="yellow sysdate20121001"></div>
<div class="blue sysdate20121001"></div>
What I would like to do is build functionality for users to filter first by color, then by date range, for example:
Date Start: 10.3.2010, Date End: 8.23.2013, color = blue and red.
After a bit of research, I have a date range working as a modification from this post. I eventually hope to link the min and max dates to a slider.
var minDate = 20120101;
var maxDate = 20130813;
var dateValue = [];
dateValue = $('.color-shape').filter(function(index){
var $this = $(this);
var matcharr = $this.attr('class').match(/sysdate([0-9]*)/);
if (matcharr) {
var date = parseInt(matcharr[1]);
return ((date >= minDate) && (date <= maxDate));
} else {
return false;
}
});
Additionally, I have the color property filtered via combination filter method using checkboxes:
$checkboxes.change(function(){
var filters = [];
// get checked checkboxes values
$checkboxes.filter(':checked').each(function(){
filters.push( this.value );
});
filters = filters.join(', ');
$container.isotope({ filter: filters });
});
My question is, how (if at all) can I combine these two elements? Since an object needs to be passed to filter, is there any way to combine the objects, or perhaps run a two-part filter?
Apologies if the answer is right in front of me as I'm a bit new to jQuery this deep.
UPDATE: With the help of a friend I got through some of this! Basically it involves creating a third var and pushing the arrays together in to a new object.
