2017-01-16 8 views
0

DataTablesテーブルに単純なドロップダウンリスト(「30日」、「60日」、「90日」、「1年」、「すべての日付」)を追加しようとしています日付列の値でテーブルをフィルタリングします。DataTableで日付範囲のフィルタリングを追加する

私はthisを見てきましたが、テキストボックスに入力された最小と最大の範囲でフィルタリングする方法を理解していますが、それを素敵なドロップダウンフィルタに移植する方法はわかりません。

+0

私たちが実験できるように、おそらくJSFiddleにいくつかのサンプルデータを提供できますか? – annoyingmouse

答えて

1

これは、あなたが必要と何をすべきいくつかの設定が必要になります。

$.fn.dataTableExt.afnFiltering.push(
    function(oSettings, aData, iDataIndex) { 
    if (typeof $('#duration').val() !== "undefined") { 
     var duration = $('#duration').val(); 
     var durationBits = duration.split(" "); 
     var durationInt = ~~durationBits[0]; 
     var durationString = durationBits[1]; 
     var now = moment("2013/08/11", "YYYY/MM/DD"); 
     var targetDate = now.subtract(durationInt, durationString); 
     var iDateCol = 4; 
     var colDate = aData[iDateCol]; 
     if (duration === "All") { 
     return true; 
     } else { 
     return moment(colDate, "YYYY/MM/DD").isSameOrAfter(targetDate); 
     } 
    } else { 
     return true; 
    } 
    } 
); 

あなたが利用できるようにmomentjsをも必要となります。私は、実践的な作業例hereを持っています。基本的に日付をとり、該当する減算が行われた日付の後に、列の日付が同じか、日付の後にあるかどうかをテストするために、momentを使用します。次に、選択値が変更されたときにテーブルを再描画します。希望が役立ちます。

関連する問題