2017-11-08 16 views
0

で動的に変更するので、私のdatatables要素のtdクラスを動的に変更しようとしています。私の研究からfnRowCallbackが見つかりましたが、それは解決策のようですが、動作させることができません。tdクラスをDatatables

"fnRowCallback": function(nRow, aData, iDisplayIndex, iDisplayIndexFull) { 
    for (var i in aData) { 

     // Check if a cell contains data in the following format: 
     // '[state] content' 
     if (aData[i].substring(0,1)=='[') { 

     // remove the state part from the content and use the given state as CSS class 
     var stateName= aData[i].substring(1,aData[i].indexOf(']')); 
     var content= aData[i].substring(aData[i].indexOf(']')+1); 
     $('td:eq('+i+')', nRow).html(content).addClass(stateName); 
     } 
    } 
    } 

しかし、これは私のために動作しません、私はエラーを取得::スタックで、ここでの質問の1から私が見つかりました。キャッチされないでSyntaxError:予期しないトークン、そして私の要素は、「[クラス名]コンテンツ」形式を保ちます。ここに私のjavascript機能は次のとおりです。

$('#tableId').DataTable({ 
    "ajax" : "function.php", 

    "columns" : [ 
    { 
     "data" : "id" 
}, { 
     "data" : "firstElement" 
}, { 
     "data" : "secondElement" 
}, { 
     "data" : "thirdElement" 
}], 

"fnRowCallback": function(nRow, aData, iDisplayIndex, iDisplayIndexFull) { 
    for (var i in aData) { 

     // Check if a cell contains data in the following format: 
     // '[state] content' 
     if (aData[i].substring(0,1)=='[') { 

     // remove the state part from the content and use the given state as CSS class 
     var stateName= aData[i].substring(1,aData[i].indexOf(']')); 
     var content= aData[i].substring(aData[i].indexOf(']')+1); 
     $('td:eq('+i+')', nRow).html(content).addClass(stateName); 
     } 
    } 
    }, 

"iDisplayLength": 5, 

"scrollX": true, 

"orderFixed": [[ 0, "asc"]] 

}); 

function.phpは私にすべてのフィールドを持つJSONを与える、とのもので、私はクラスIフィールドに「[クラス名]コンテンツ」を使用に変更します。どのようにそれを動作させるための任意のアイデアですか?

おかげ

+0

"予期しないトークン"によって、いくつかのタイプミスがあります。ここでJsFiddleや実行可能なコードを設定することができれば、速やかに解決するのに役立ちます。 –

+0

このエラーは、コンソールでこの機能を実行しようとしたときにのみ表示されていました。しかし、それは動作しているコードで、私はconsole.logでテストしました。何も動かないのは$( 'td:eq(' + i + ')'、nRow).html(content).addClass(s​​tateName)です。 –

+0

問題の原因となるコードに印刷できない文字がある可能性があります。前後の空白行を削除して試してみてください。 –

答えて

0

あなたのコードを通報しaDataが連想例えば配列、あろうことである:

あなたが for...in構築物でプロパティを列挙
{ "id": 1, "firstElement": "[class] content" } 

iが開催するプロパティ名(idfirstElement)数値指数ではありません。

したがって、iを使用して特定の行内のセルにアクセスすることはできません。

コードのもう1つの問題は、作成後にHTMLコンテンツを設定することです。 jQuery DataTablesはセルの内容を更新したことに気付かないでしょう。

関連する問題