[Solved] Having issues in filtering with product list with data attributes

by


Here is the JS code you need to modify:

    var a=$("input.brand");
    var b=$("input.store");
    var brand=new Array();
    var store=new Array();
$('input[type="checkbox"]').change(function(){
    if($(this).is(":checked")){
       $('#prod >div').hide();
       if(this.className == "brand"){
           console.debug("brand checked");
           brand.push($(this).attr('id'));
        }else if(this.className == "store"){
           console.debug("store checked");
           store.push($(this).attr('id'));
        }
         console.log(brand+","+store);
         displaydivs(brand,store);
    }else{
     $('#prod >div').show();
     if(this.className == "brand"){
         var index = brand.indexOf($(this).attr('id'));
         if (index > -1) {
            brand.splice(index, 1);
         }       
     }else if(this.className == "store"){
         var index = store.indexOf($(this).attr('id'));
         if (index > -1) {
            store.splice(index, 1);
         } 
     }
     displaydivs(brand,store);
    }     
});


    function displaydivs(brand,store)
    {
        $("#prod >div").hide();
    if(brand.length > 0 & store.length > 0){ 
        $.each(brand, function( index, value ){
            var temp = $("#prod >div[data-brand="+value+"]")[0];
            var data = $(temp).attr("data-store");
            var idx = store.indexOf(data);
            if(idx > -1){
              $("#prod >div[data-brand="+value+"][data-store="+data+"]").show();
            }            
        });  
        $.each(store, function( index, value ){
            var temp = $("#prod >div[data-store="+value+"]")[0];
            var data = $(temp).attr("data-brand");
            var idx = brand.indexOf(data);
            if(idx > -1){
              $("#prod >div[data-brand="+data+"][data-store="+value+"]").show();
            }            
        });
    }
    else if(brand.length > 0 & !(store.length > 0)){ 
        $.each( brand, function( index, value ){
            $("#prod >div[data-brand="+value+"]").show();
        });
    }
    else if(!(brand.length > 0) & store.length > 0){ 
        $.each( store, function( index, value ){
            $("#prod >div[data-store="+value+"]").show();
        });
    }else{
        $("#prod >div").show();
    }
    }

Demo : http://jsfiddle.net/qxxL2/4/

3

solved Having issues in filtering with product list with data attributes