過濾

2017-07-03 40 views
0

鏈接到過濾器時,將顯示爲空禁用複選框:
code:http://jsfiddle.net/ar3PY/92/過濾

問:
我可以過濾和我會導致「空」 但如何禁用複選框即過濾時無論如何都會顯示爲空。

!!請注意,每個類別不得過濾本身,只能與其他類別過濾。

例如
如果我檢查 「VOLVO」 和 「銀」 我得到 「空」。

我在尋找的是:
如果我檢查「沃爾沃」,那麼「銀色」將被禁用。

圖片,顯示它應該如何工作
enter image description here

回答

1

基本上你只需要訪問你的類屬性,使其工作。我叉你的小提琴,這裏的修改後的版本:在下面的工作小提琴發現

$("#filters :checkbox").click(function() { 
     var subj = this; 
     resetBoxes(); 
     $(".filterme").show(); 

    if(this.checked){ 
     var all = $(".filterme"); 
     var tgts = all.filter(getFilter("brand")).filter(getFilter("class")).filter(getFilter("color")); 
     var brandtgt = tgts[0].className.split(' ')[1]; 
     $("#filters :checkbox").each(function(idx){ 
     var inval = $(this).attr("value"); 
     var brandclasses = tgts[0].className.split(' '); 
     var found = $.inArray(inval, brandclasses); 

     if(found<0){ 
      disable($(this)); 
     } 

     }); 
    all.not(tgts).hide(); 
    tgts.show(); 
    if (tgts.length == 0) { 
     $('.empty').show(); 
    } else { 
     $('.empty').hide(); 
    } 
} 
}); 

我已經包括了輔助功能(resetBoxes, enable, disable)。

http://jsfiddle.net/ppzwmvs9/6/

+0

看起來不錯,但兩件事情還是留給: 1.如果沒有複選框被選中,我將能夠檢查整個類別的汽車品牌或carstyle或顏色。像圖片展示我可以點擊奧迪,寶馬和沃爾沃,然後過濾顏色和汽車。 2.當我檢查一些複選框,然後取消全部選中時,我注意到一些錯誤,一些複選框仍然被禁用。 Thx求助! – Doodl

+0

很高興爲您提供幫助,是的,這是一個粗略的代碼,帶有關於檢查類的指針,讓您開始 - 特別是訪問形成代碼的className嚴重依賴它,最終可以擴展它以重置複選框,甚至最初禁用或隱藏複選框的其餘部分,使第一步成爲品牌選擇。 – Qiqo

+0

你可以修復你留下的錯誤,如果我檢查一些複選框,然後取消選中它們,一些複選框仍然被禁用,並且它感覺有錯誤。 :/ – Doodl

0

如何顯示檢查過濾器,只爲每個類別exacly相同屬性的內容?

也看到圖像的解釋:

How to show content of checked filter that only has exacly same attribute for each category? see also image:

的jsfiddle位置: http://jsfiddle.net/ar3PY/104

var getFilter = function (category) { 
    var filter = $("#filters ." + category + ":checked").map(function() { 
     return '[data-filter*="' + this.value + '"]'; 
    }).get().join(","); 
    filter = (filter.length > 0) ? filter : "*"; 
    return filter; 
}