0
私はソートと検索のために作成した次のコードを持っています。AngularJS - 既定の並べ替え順序が検索でレンダリングされないテーブル
aaSorting
を追加すると、指定した列で初期テーブルをソートすることができます。しかし、検索では、テーブルが完全になくなり、DOMから削除されます。
デフォルトでは、aaSortingはdtOptionsBuilderにチェーンされていますが、デフォルトのソート順は設定されていません。
問題をどのように修正できますか?
角度コード
$scope.searchOrderHistoryData = function(){
if ($scope.searchQuery.trim() == "")
{
$scope.cancel=false;
return;
}
else{
$scope.IssearchQuery = true;
}
$scope.filterOrderHistoryData = $scope.orderHistory.filter(function(r) {
res = "";
found = true;
for (key in r)
{
if ((key == "OrderId" || key == "OrderName" || key == "TotalCost" || key == "SubmittedDate" || key == "SubmittedBy" || key== "Status") && r[key] != null)
res += angular.lowercase(r[key].toString()) + " ";
}
if (res.indexOf(angular.lowercase($scope.searchQuery)) >= 0)
return true;
return false;
});
}
var orderHistoryCols = {'OrderId':0, 'TotalCost':1, 'SubmittedDate':2, 'SubmittedBy':3, 'Status':4};
$scope.dtOptions = DTOptionsBuilder.newOptions()
.withOption('responsive', true)
.withOption('fnDrawCallback', function() {
$('.dataTables_scrollBody').on("scroll", function(){ //activate when #center scrolls
var left = $('.dataTables_scrollBody').scrollLeft(); //save #center position to var left
$('.dataTables_scrollHead').scrollLeft(left); //set #top to var left
});
})
.withOption('bAutoWidth', false)
//.withOption('sorting', false)
.withOption('scrollY', '450px')
.withOption('aaSorting', [[orderHistoryCols.SubmittedDate, 'desc']]);
テンプレート(HTML)
<table datatable="ng" class="table" dt-options="dtOptions" dt-column-defs="dtColumnDefs">
<thead style="background-color: #d8d8d8;">
<tr>
<!--th ng-hide="true"></th-->
<th>Order #</th>
<th>Total Cost</th>
<th>Submitted</th>
<th>By</th>
<!-- <th>Delivered</th> -->
<th>Status</th>
<th data-orderable="false"></th>
<th data-orderable="false"></th>
</tr>
</thead>
<tbody>
<tr style="font-weight: 100;cursor: pointer;" ng-repeat="data in filterOrderHistoryData">
Table data...
</tr>
</tbody>
</table>
.withOption( 'aaSorting'、[[orderHistoryCols.SubmittedDate、 'desc']]);このDOMの削除を防ぐには、別の列を最初にクリックする必要があります。 SubmittedDateをすぐにクリックして昇順にソートすると、DOMの削除の問題が発生します。どうして?また、テーブルの二重フリッカー(並べ替えやフィルタリングの際にちらつきが発生するので、この場合はレンダリングが2回しか発生しません) – Vahe