web-dev-qa-db-ja.com

jquery DataTables。フィルターされた(可視)行を取得する方法

Jqueryデータテーブルにフィルターを適用するボタンがあります

$("#buttonFilter").button().click(function() {
                if (lboxColor.val() != null) {
                    jqTable.fnFilter($("option:selected", lboxColor).text(), 1);
                }
            });

たとえば、60から47行が表示されます。fnGetData()およびfnGetNodes()を試しましたが、すべての行が表示されていますが、フィルターされていません。どうすれば47行を取得できますか?

19
Yuri

フィルターされた(より適切な用語: "searched")行を取得したい場合は、DataTables 1.10+を使用している人のために、約1時間検索しました。

var table = $('.table').DataTable({...});

function selectOnlyFiltered(){
   var filteredRows = table.rows({filter: 'applied'});
}
25
Jack

データテーブル1.9以降の場合、このソリューションは機能します。

myDataTableHandle = $('#example1').dataTable(...);
...
...
var myFilteredRows = myDataTableHandle._('tr', {"filter":"applied"});

別のAPIプラグインを含める必要はありません。 :)

18
RayLoveless

FngetNodes()のようにノード(DOM要素)のコレクションが必要な場合に備えて、このように '_'の代わりに '$'を使用できますtable.$('tr', {"filter":"applied"});

'_'は 'TR'(html要素)のコレクションを返します。

6
Bedouin

興味のある人にとって、これは具体的なユースケースです。

/**
 * Select all the elements of the datatable which match the current user
 * search (or all if no search).
 */
function dtable_selectAll()
{
    idTable = 'myDataTable';
    var rows = $('#' + idTable).dataTable()
            .$('tr', {"filter":"applied"});
    var oTT = TableTools.fnGetInstance(idTable);
    $(rows).each(function (index, el){
        oTT.fnSelect(el);
    })
}

それが役に立てば幸い。

0
Moebius

現在のバージョンでは selector-modifier は少し異なるプロパティセットを使用します。

var table = $('#example').DataTable();
var rows = table.rows({"search" : "applied"});

そして、あなたはこのようにセルデータを反復することができます:

table.rows({"search":"applied" }).every( function () {
    var data = this.data();
});

いくつかの役立つリンク:

0
billynoah

dataから1つの列のみ AND 表示されている行からのみを取得するのに苦労している人のために、実際には次のように「セレクター」を組み合わせることができます

var total = api
      .column(2, { search: 'applied' }) // <-- only 3rd column && only visible after applied search
      .data()
      .reduce(function (a, b) {
        return floatVal(a) + floatVal(b)
      }, 0)

また、{page: 'current'}が現在表示されている行の適切なセレクターであると述べているいくつかのソースに気づきましたが、これは実際にはページ分割後に表示される行を提供します。

0
David Otto