javascript - list.js と複数の検索ボックスを使用して、ボックスごとに限られたフィールドを並べ替える

Question

要素のリストをすばやく並べ替える方法として list.js を使用しています。検索ボックスで任意のパラメーターに沿って並べ替えることができるように設定しましたが、たとえば、最初のボックスが名前で並べ替えられ、次に2番目のボックスが名前で並べ替えられるように設定したいと思いますtype または type2 でソートします。

これにより、ユーザーは、この例の場合、最初のボックスを使用して名前で検索し、2 番目のボックスを使用して結果をさらに絞り込むことができます。解決策が何であるかを恐れています。これは、フィールドが少なく、ボックスが検索する非表示のデータの別のコピーを含めることですが、最適とは言えない場合でも、その検索で見つかった結果を検索という名前で翻訳するためのアプローチ。

これは私がこれまでに持っているものであり、すべてが魅力のように機能しますが、これを必要なものに押し上げる助けがあれば助かります.

<div id="results">
    <input class="search" /><br />
    <span class="sort" data-sort="name">Sort by Pokemon Name</span><br />
    <span class="sort" data-sort="type">Sort by Pokemon Type</span><br />
    <span class="sort" data-sort="type2">Sort by Second Type</span><br />
    <span class="sort" data-sort="number">Sort by Number</span><br />
    <ul class="list"></ul>
</div>
    <script>
        var options = {
        item: '<li><h3 class="name"></h3><p class="type"></p><p class="type2"></p></li>'
         };

        var values = [
            {name: 'Bulbasaur', type: 'Grass', type2: 'Poison', number: '001'}
        , {name: 'Ivysaur', type: 'Grass', type2: 'Poison', number: '002'}
        , {name: 'Venusaur', type: 'Grass', type2: 'Poison', number: '003'}
    ];
var pokeList = new List('results', options, values);
</script>