使用複選框來過濾數據

-1

我有一個使用PHP的MySQL數據庫，生成下面的HTML。使用複選框來過濾數據

<div class="item filterable united-states" data-amount="14000"> 
    Supplier Country: United States 
    Delivery Estimation: 5 days 
    Quote Amount: 14000 
<div> 

<div class="item filterable united-states" data-amount="7000"> 
    Supplier Country: United States 
    Delivery Estimation: 30 days 
    Quote Amount: 7000 
<div> 

<div class="item filterable united-kingdom" data-amount="13000"> 
    Supplier Country: United Kingdom 
    Delivery Estimation: 15 days 
    Quote Amount: 13000 
<div> 

<div class="item filterable germany" data-amount="8700"> 
    Supplier Country: Germany 
    Delivery Estimation: 22 days 
    Quote Amount: 8700 
<div>

我還創建了一個循環，根據結果集中的國家創建複選框。造成這種情況的HTML看起來像：

<div class="checkbox check-default" id="country-filter"> 
    <strong>Countries</strong><br> 

    <input type="checkbox" value="germany" id="germany-checkbox" /> 
    <label for="germany-checkbox">Germany</label> 

    <input type="checkbox" value="united-kingdom" id="united-kingdom-checkbox" /> 
    <label for="united-kingdom-checkbox">United Kingdom</label> 

    <input type="checkbox" value="united-states" id="united-states-checkbox" /> 
    <label for="united-states-checkbox">United States</label> 
</div>

所以，我發現了一些jQuery的片段和編輯它來過濾的結果是這樣的：

$("#country-filter :checkbox").click(function() { 
$("div.item").hide(); 
$("#country-filter :checkbox:checked").each(function() { 
$("div." + $(this).val()).show().slideDown(400); 
}); 
});

jQuery的片段有助於過濾結果，但不是在我想要的方式。結果加載得很好，當一個複選框被選中時，它得到的結果應該顯示得很好。但是，當所有複選框都未選中時，所有結果都會消失，直到單擊複選框。

此外，我想要另一個過濾器來處理與國家過濾器協同工作的數量部分。

我該怎麼辦？

來源

2014-09-23 user3754923

對於第一個問題，更換您的$("div.item").hide();與

if ($("#country-filter :checkbox:checked").length > 0) 
{ 
    $("div.item").hide(); 
} 
else 
{ 
    $("div.item").show(); 
}

其他的，設置一個變量（JavaScript或jQuery的），並將其設置爲0，你進入你的每個循環之前。從每個展示的div中抓取並添加數據量參數的內容。一旦你完成了，你將有一個變量，其中總數

來源

2014-09-23 21:06:15

它仍然沒有解決問題。當沒有選中複選框時，所有結果都將消失。 – user3754923 2014-09-23 22:12:34

我的錯誤。忘記包括「：檢查」。試試這個版本。 – 2014-09-24 13:01:20

這工作很好。你有什麼想法如何去關於另一個？ – user3754923 2014-09-24 17:34:50

使用複選框來過濾數據

回答

相關問題