0

この質問は、実際には、チェックボックスの任意のグループを使用したフィルタリングに適用されます。jQuery UI MultiSelectウィジェットを使用して、クラス名で製品をフィルタリングしています。私のコードは、1つのボックスだけがチェックされている場合はうまく機能しますが、複数が選択されている場合は結果を返しません。どういうわけか配列をマップする必要があると思いますが、それを行う方法がわかりません。ウィジェットのドキュメントには、これを行うように記載されています。

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();
});
4

1 に答える 1

0

私はこの質問を4分の1の単語で行い、すぐに答えを得ました（時にはそれが役立つこともあります）。これを解決するための鍵は「.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();
于 2012-09-25T22:50:38.057 に答える