1
2つのDataTablesオブジェクトがページにあり、searchResultsTableとcurrentPortfolioTableを呼び出します。私は、ボタンをクリックすると、fnReloadAjaxプラグインを使用してDataTablesをオンデマンドでリロードしています。ただし、テーブルの1つのみが新しいデータ（currentPortfolioTable）をロードしますが、searchResultsTableはデータのajax要求を実行しますが、新しい（有効な）データはテーブルにロードできません。2つのjQuery DataTables - 列の表示/非表示を試みるなど - データテーブルの1つでは失敗しますが、他のデータテーブルでは失敗します
私はDataTableを破壊し、新しいものを作成しようとしました。また、fnReloadAjaxプラグインの一部を書き直して、別の結果が得られるかどうかを確認しました。
fnReloadAjaxだけがcurrentPortfolioTableに対して呼び出された場合でも、読み込まれた新しいデータの表示は拒否されます。
新しいデータのロードに失敗したsearchResultsTableの問題は、DataTableのaoColumnsプロパティのbVisible状態を使用して列の表示/非表示にも発生します。
サンプルコード：
var dataTableObjects = dataTableObjects || {
"searchResultsTable": {},
"currentPortfolioTable": {}
};
var _rankingsRootUrl = window.ROOT + 'rankings/';
var _defaultDataTableSettings = {
"aoColumns": [
{ "bSortable": false,
"sTitle": "Add to Portfolio",
"bVisible": true
},
{
"bSortable": true,
"sTitle": "Name of Investment",
"bVisible": true
},
{ "bSortable": true,
"sTitle": "Chart",
"bVisible": true
},
{ "bSortable": true,
"sTitle": "Rating",
"bVisible": true
},
{ "bSortable": true,
"sTitle": "Minimum",
"bVisible": true
},
{ "bSortable": true,
"sTitle": "ROR",
"bVisible": false
},
{ "bSortable": true,
"sTitle": "Max DD",
"bVisible": false
},
{ "bSortable": true,
"sTitle": "Sharpe",
"bVisible": false
},
{ "bSortable": true,
"sTitle": "Sterling",
"bVisible": false
}
],
"aaSorting": [
],
"sAjaxSource": _rankingsRootUrl + 'search_results/',
"bServerSide": true,
"bProcessing": true,
"bPaginate": false,
"bLengthChange": false,
"sScrollY": 200,
"sScrollX": "100%",
"sScrollXInner": "100%",
"bScrollCollapse": true,
"fnServerData": function (sSource, aoData, fnCallback) {
$.ajax({
"dataType": 'json',
"type": "POST",
"url": sSource,
"data": aoData,
"success": fnCallback
});
},
"fnServerParams": function (aoData) {
aoData.push(
{"name": "program_type", "value": $(':input#RankingProgramType').val()},
{"name": "program_name", "value": $(':input#RankingProgramName').val()},
{"name": "min_investment", "value": $(':input#RankingMinimumInvestment').val()},
{"name": "rate_of_return", "value": $(':input#RankingRateOfReturn').val()},
{"name": "max_dd", "value": $(':input#RankingMaxDd').val()},
{"name": "time_span", "value": $(':input#RankingTimeSpan').val()},
{"name": "flags", "value": $(':input#RankingFlags').val()},
{"name": "strategies", "value": $(':input#RankingStrategies').val()},
{"name": "recommended", "value": $(':input#RankingRecommended').val()},
{"name": "portfolio_id", "value": (window.PORTFOLIO && window.PORTFOLIO.id) || ""}
);
}
};
var _defaultCurrentPortfolioTableSettings = {
"aoColumns": [
{
"bSortable": true,
"sTitle": "Name of Investment",
"bVisible": true
},
{ "bSortable": true,
"sTitle": "Chart",
"bVisible": true
},
{ "bSortable": true,
"sTitle": "Rating",
"bVisible": true
},
{ "bSortable": true,
"sTitle": "Minimum",
"bVisible": true
},
{ "bSortable": true,
"sTitle": "ROR",
"bVisible": false
},
{ "bSortable": true,
"sTitle": "Max DD",
"bVisible": false
},
{ "bSortable": true,
"sTitle": "Sharpe",
"bVisible": false
},
{ "bSortable": true,
"sTitle": "Sterling",
"bVisible": false
}
],
"aaSorting": [
],
"sAjaxSource": _rankingsRootUrl + 'current_portfolio/',
"bServerSide": true,
"bProcessing": true,
"bPaginate": false,
"bLengthChange": false,
"sScrollY": 200,
"sScrollX": "100%",
"sScrollXInner": "100%",
"bScrollCollapse": true,
"fnServerData": function (sSource, aoData, fnCallback) {
$.ajax({
"dataType": 'json',
"type": "POST",
"url": sSource,
"data": aoData,
"success": fnCallback
});
},
"fnServerParams": function (aoData) {
aoData.push(
{"name": "portfolio_id", "value": (window.PORTFOLIO && window.PORTFOLIO.id) || ""}
);
}
};
dataTableObjects.searchResultsTable = $('#search-results table').dataTable(_defaultDataTableSettings);
dataTableObjects.currentPortfolioTable = $('#currently-in-portfolio table').dataTable(_defaultCurrentPortfolioTableSettings);
$("#rankings").on("click", "a.add", function (e){
dataTableObjects.searchResultsTable.fnReloadAjax('/datable1-url');
dataTableObjects.currentPortfolioTable.fnReloadAjax('/datable2-url');
e.preventDefault();
});
試み修正：fnReloadAjaxからのコールバックメソッドを使用し
- 各テーブルのIDが一意であることを確認dataTable2
- のデータのリロードを発射する
- dataTableJSObjectsがページの正しいユニークなテーブルであることを確認する
- コンソールがJShinted JSオフ回さ一切のjsエラーやミス
- がfnReloadAjax dataTableObjects.searchResultsTableとdataTableObjects.currentPortfolioTableが正常にfnDraw
2番目のテーブルで返されるAJAXの応答は何ですか？予想されるデータかサーバーのエラーですか？ – Jeff
期待される有効なデータ。 –
あなたのセレクタが間違っているか、ページに重複した 'id'があるかもしれないということが唯一のことです。 – Jeff