Ajaxを使用してjQuery DataTableにデータを取り込むことができます。しかしその後、jQuery DataTablesの検索、並べ替え、ページ設定が機能しなくなりました。助けてください。ここでjQuery DataTablesの検索、並べ替え、ページ番号付けは、ajaxデータでは機能しません。
は私のHTMLコードです:
以下<table id="account-details-result-table"
class="table table-bordered text-center css-fonts-calibri">
<thead>
<tr>
<th>Organization Id</th>
<th>Organization Name</th>
<th>Parent OpCo Name</th>
<th>Registered Email Id</th>
<th>Registered Phone Number</th>
</tr>
</thead>
<tbody id="search-results-table-tbody">
<!-- append data here -->
</tbody>
</table>
は、検索結果のjQueryのDataTableのを初期化する機能です。私は$(ドキュメント).ready()内にそれを呼び出す」:あなたは成功したAJAX呼び出した後のDataTableをリコールする必要がある。この問題については
function sendSearchAccountDetailsRequest(orgQueryReqJSONString){
$.ajax({
type : 'POST',
url : ctx+'/SearchController',
data: orgQueryReqJSONString,
contentType: 'application/json',
success : function(response) {
//process JSON response here
var counter = 0;
var tableDataHTML = '';
$.each(response.organizationDetailsList, function(counter){
var $curr = response.organizationDetailsList[counter].organizationDetails;
tableDataHTML += '<tr id="searched-row-'+counter+'" class="js-result-tbl-tbody-tr">'+
'<td>'+$curr.organizationID+'</td>'+
'<td>'+$curr.organizationName+'</td>'+
'<td>'+$curr.parentOpCoName+'</td>'+
'<td>'+$curr.registeredEmailID+'</td>'+
'<td>'+$curr.registeredPhoneNo+'</td>'+
'</tr>';
});
$('#search-results-table-tbody').empty();
$('#search-results-table-tbody').append(tableDataHTML);
},
error : function(response) {
//handle errors here
alert('Error !!!'+response);
}
});
}
@Shiffty、私はその部分について知っています。しかし、私は上記のアプローチだけに従わなければならない。 –
私はあなたがこれをやっていると仮定しているので、サーバー側のデータを読み込むことができますが、クライアント側のページングや並べ替えなどを使用できますか?だから、テーブルは正常に移植されますが、データテーブルの機能は動作していませんか? – markpsmith