2012-09-25 29 views
0

這個問題實際上適用於使用任何一組複選框進行過濾。我正在使用jQuery UI MultiSelect Widget按類名過濾產品。當只有一個框被選中時,我的代碼效果很好,但是如果選擇了多個框,則不會返回結果。我想我需要映射一個數組,但我不確定如何去做。小部件文件說這樣做:使用jQuery UI MultiSelect Widget過濾div類 - 當多個框被選中時如何過濾?

var array_of_checked_values = $("select").multiselect("getChecked").map(function(){ 
    return this.value; 
}).get(); 

...但這並沒有幫助我。請幫我讓這個過濾器工作。謝謝!

<div class="main"> 
    <article class="contemporary"></article> 
    <article class="abstract"></article> 
    <article class="impressionist"></article> 
</div> 

<select id="filterGenre" name="filterGenre" multiple="multiple"> 
    <option value="abstract">Abstract </option> 
    <option value="contemporary">Contemporary </option> 
    <option value="impressionist">Impressionist </option> 
</select> 
<button class="submitFilters" type="button">GO</button> 


//creates the multiselect widget: 
$("#filterGenre") 
    .multiselect({ 
     noneSelectedText: 'Select Genre', 
     selectedText: 'Select Genre', 
     minWidth: 120 
    }); 
//a button to submit the form selections: 
$(function() { 
     $("button.submitFilters").button({ 
      icons: { 
       primary: "ui-icon-triangle-1-e" 
      }, 
     }); 
    }); 

//the filter actions: 
$('button.submitFilters').click(function() { 
     var genreVal = $('#filterGenre').val(); 
    $('.main article').hide(); 
    $('.main article[class*=' + genreVal + ']').show(); 
}); 

回答

0

我問了這個問題的四分之一的話,並立即得到答案(有時幫助)。解決這個問題的關鍵是「.join」......必須加入數組來按類過濾產品。我錯誤地定義了我的「genreVal」變量...應該這樣做:

var genreVal = $("#filterGenre").multiselect("getChecked") 
       .map(function(){return "." + this.value; }) 
       .get() 
       .join(); //<--the missing link... 

//then i used: 

    $('.main article').hide(); 
    $('.main article[class*=' + genreVal + ']').show(); 
+0

實際上,因爲我的產品有多個類,類指示符「。」不應該包含,所以像這樣:var genreVal = $(「#filterGenre」)。multiselect(「getChecked」) .map(function(){return「。」+ this.value;}) .get ) .join() – Earl1234