Question

我正在使用数据表1.10，并且有一个相当大的表，需要一分钟左右才能加载。当按降序排序时，表通常最有用，所以必须按（列）升序，等待，然后排序（列）降序排序是相当烦人的。我知道默认情况下有一种方法可以对列进行排序，但实际上我没有运气。这是我的表：

<div class="row">
    <div class="col-xs-12">
        <table id="reportTable" class="table table-condensed table-hover table-columntoggle display">
            <thead>
                <tr>
                    <th data-searchable="false" data-orderable="false" data-defaultcontent="" class="details-control"></th>
                    <th class="dt-left" data-data="ManufacturerPartNumber">Part Number</th>
                    <th class="dt-left" data-data="ItemName">Item Name</th>
                    <th class="dt-left" data-template="#templateWarehouseName">Warehouse</th>
                    <th class="dt-center" data-data="QuantityTimeBlock1" id="QuantityTimeBlock1Label">Quantity 0 to 45 Days</th>
                    <th class="dt-center" data-data="QuantityTimeBlock2" id="QuantityTimeBlock2Label">Quantity 46 to 90 Days</th>
                    <th class="dt-center" data-data="QuantityTimeBlock3" id="QuantityTimeBlock3Label">Quantity 91+ Days</th>
                    <th class="dt-center" data-data="TotalQuantity">Total Quantity</th>
                    <th class="dt-center" data-data="ValueTimeBlock1" id="ValueTimeBlock1Label">Value 0 to 45 Days</th>
                    <th class="dt-center" data-data="ValueTimeBlock2" id="ValueTimeBlock2Label">Value 46 to 90 Days</th>
                    <th class="dt-center" data-data="ValueTimeBlock3" id="ValueTimeBlock3Label">Value 91+ Days</th>
                    <th class="dt-center" data-data="TotalValue">Total Value</th>
                    <th class="dt-center" data-data="CurrencyType">Currency</th>
                </tr>
            </thead>
            <tfoot>
                <tr>
                    <th colspan="4" class = "dt-left">Page Totals:</th>
                    <th class = "dt-left">Total:</th>
                    <th class = "dt-left">Total:</th>
                    <th class = "dt-left">Total:</th>
                    <th class = "dt-left">Total:</th>
                    <th class = "dt-left">Total:</th>
                    <th class = "dt-left">Total:</th>
                    <th class = "dt-left">Total:</th>
                    <th class = "dt-left">Total:</th>
                    <th></th>
                </tr>
            </tfoot>
            <tbody></tbody>
        </table>
    </div>
</div>

相关代码：

    <script>
    $(function() {
        var templateDetails = _.template($('#templateDetails').html(), { variable: 'data' });
        var dataTable = $('#reportTable').abcdDataTable({
            'drawCallback': onDrawDataTable,
            "formSelector": "#InventoryAgingValuationSearch",
            "searching": false,
            "url": "/Reports/InventoryAgingValuation/Search",
            "order": [[1, "desc"]],
            /*"columns": [
                { "defaultContent": "" },
                { "defaultContent": "" },
                { "defaultContent": "" },
                { "defaultContent": "" },
                { "orderSequence": ["desc", "asc"] }, //first sort desc, then asc,
                { "orderSequence": ["desc", "asc"] },
                { "orderSequence": ["desc", "asc"] },
                { "orderSequence": ["desc", "asc"] },
                { "orderSequence": ["desc", "asc"] },
                { "orderSequence": ["desc", "asc"] },
                { "orderSequence": ["asc", "desc"] },
                { "orderSequence": ["desc", "asc"] },
                { "defaultContent": "" }
            ],*/
            "footerCallback": function (row, data, start, end, display) {
                ...
            }
        });
        var tableApi = dataTable.api();

        function onDrawDataTable() {
            $("#reportTable").find('.has-popover').popover();
        }

        $('#reportTable tbody').on('click', 'td.details-control', function() {
            ...

                var newTable = $(row.child()).find('table.NestedItemsTable').abcdDataTable({
                    "searching": false,
                    "url": "/Reports/InventoryAgingValuationItems/Search",
                    "bPaginate": false,
                    "exporting": false,
                    "bInfo": false,
                    "asSorting":  ['desc'],
                    "ajaxData": function(d) {
                        d["WarehouseId"] = warehouseFilter;
                        d["ItemId"] = itemFilter;
                        d["IncludeSerializable"] = includeSerializableFilter;
                        d["IncludeBulk"] = includeBulkFilter;
                        d["ManufacturerPartNumber"] = $('#ManufacturerPartNumber').val();
                        d["ItemName"] = $('#ItemName').val();
                        d["SerialNumber"] = $('#SerialNumber').val();
                        d["OwnedByCompanyId"] = $('#OwnedByCompanyId').val();
                        d["CustomerPurchaseOrderNumber"] = $('#CustomerPurchaseOrderNumber').val();
                        d["AbcdPurchaseOrderNumber"] = $('#AbcdPurchaseOrderNumber').val();
                    },
                    "order": [[1, "desc"]]
                });
            }
        });

        $("#InventoryAgingValuationSearch .btn-group .btn").click(function () {
           ...
        });
    });
</script>

当前配置代码的方式，它无法通过在第一次单击时降序进行排序。我的第一次尝试导致上面的注释掉的块，以

的形式

{ "orderSequence": ["desc", "asc"] }, //first sort desc, then asc,

我是否应该取消注释，我在第0行的“请求的未知参数'x'的行中得到一个数据表错误。数据表文档说这可能意味着搞砸了，或者我有太多行。据我所知，HTML中的内容并不重要，因为它位于页脚中。如果我删除了一行，另一方面，页面会挂起并且不会超出“加载”。

我该如何运作？

Answer 1

好吧，我决定采用这个问题的优雅但工作的解决方案。因为它似乎不太可能在客户端运行良好，我改变了控制器上的排序逻辑。而不是

case InventoryAgingValuationReportColumnType.ItemName:
                            query2 = orderBy.Item2 == OrderDirection.Ascendant ? query2.OrderBy(x => x.ItemName) : query2.OrderByDescending(x => x.ItemName);
                            break;

我现在有

case InventoryAgingValuationReportColumnType.ItemName:
                            query2 = orderBy.Item2 == OrderDirection.Ascendant ? query2.OrderByDescending(x => x.ItemName) : query2.OrderBy(x => x.ItemName);
                            break;

这不是最干净的方法，并没有真正解决我在使用DataTables时遇到的问题，但这是一种暂时可以接受的解决方法。

数据表按降序排序

1 个答案: