2016-07-13 1 views
1

を使用して、その値に基づいてDataTableの各セルにCSSを適用しようとしています。CSSはすべてではなくいくつかのセルに適用されます。ここに私の問題にJsFiddleです。誰もがこの問題を遭遇し、解決策を見つけたか、これに関するアイデアを持っていますか?DataTable drawCallbackはどのように機能しますか?

"drawCallback": function(settings) { 
     var api = this.api(); 
     var visibleRows=api.rows({page:'current'}).data(); 
     if(visibleRows.length >= 1){ 
     for(var j=1;j<visibleRows[visibleRows.length -1].length;j++){ 
      $("td:eq("+j+")", settings.nTBody.childNodes[visibleRows.length -1]).addClass(visibleRows[visibleRows.length -1][j]); 
     } 
     } 
    }, 
+2

行レンダリングコールバックを見ている可能性がありますhttps://datatables.net/examples/advanced_init/row_callback.htmlあなたの目的が何であるか明確ではありません – charlietfl

答えて

2

@charlietflが言ったように、あなたは本当に行をフォーマットするdrawCallbackを使用したくない、とあなたはおそらく、この書式設定を行うにはcreatedRow(rowCallback)を使用したほうが良いでしょう。

drawCallbackは、描画イベントごとに呼び出されます。つまり、実際に追加されたばかりの行を更新したり、更新されたばかりのデータを処理するために使用されます。

createdRowは、行が作成されるたびに呼び出されるように設計されています。これは、実際に必要と思われるものです。 this documentationexample)では、作成者がこのオプションを使用して特定の行にクラスを追加する方法を表示していることがわかります。これは、実行したい行に最も近いと思われます。

私が言うことができる限り、すべてのセルにセルのテキストと同じCSSクラスがあるようにしたいと思います。次のようにcreatedRowであることを行う最も簡単な方法は、次のようになります。

"createdRow": function (row, data, index) { 
    for(var i = 0;i<data.length;i++){ 
     $('td', row).eq(i).addClass(data[i]); 
     //The above line assumes that you want to add a CSS class named "red" to a 
     //field that has the text "red" in it, if not, you can change the logic 
    } 
} 

だけ.DataTables()コールのためのあなたの初期化オプションでこれを含めます。

どのクラスにどのクラスを追加するかについての正確なロジックについていくつか仮定しなければなりませんが、正しい場合は、そのフィールドのテキストと同じ名前のクラスを各フィールドに追加する必要があります。

関連する問題