如何在数据表 mvc c# 中显示 pageLength 过滤器和打印选项

Question

我想要打印选项以及在 mvc c# 中工作的数据表中的 pageLength 过滤器。我在互联网上搜索，但与这个主题相关，我没有找到任何东西。实际上也在stackoverflow中。所以，我很惊讶这是否可能。如果是那么如何，如果不是那么为什么？

我为打印和 pageLength 过滤器编码，但它只显示打印选项而不是 pageLength 过滤器选项，如果我删除打印选项，那么它将显示 pageLength 过滤器选项。搞不懂为什么会这样？

这是我的打印视图代码和 pageLength 过滤器

$(document).ready(function () {
    // DataTable
    var table = $("#dataGrid").DataTable({
        //Report Export Start
        dom: 'Bfrtip',
        buttons: [
            {
                extend: 'print',
                exportOptions: {
                    columns: [0, 1, 2]
                },
                className: 'btn btn-default btn-xs glyphicon glyphicon-print',
                footer: true
            }
        ],
        //Report Export End

        "scrollX": false,  // scrolling horizontal
        "bSort": false,
        "bFilter": false,
        "processing": true, // for show progress bar
        "serverSide": true, // for process server side
        "filter": true, // this is for disable filter (search box)
        //"orderMulti": false, // for disable multiple column at once
        "pageLength": 5,
        "lengthMenu": [5, 10, 50, 100, 1000, 10000],

        "ajax": {
            "url": "/Ledger/LedgerList",
            "type": "POST",
            "datatype": "json",
            "data": function (d) {
                return $.extend({}, d, {
                    'SearchLedgerType': document.getElementById("search_ledgerType").value                        
                });
            }
        },

        "columnDefs":
            [{
                "targets": [2, 3],
                "visible": false,
                "searchable": true,
                "orderable": false
            }
            ],
        "columns": [
            { "data": "id", "name": "Id", "autoWidth": true },
            { "data": "name", "name": "Name", "autoWidth": true },
            { "data": "address", "name": "Address", "autoWidth": true },                    
        ]
    });
});

这是我的控制器，

[HttpPost]
public IActionResult LedgerList(Ledger ledger)
{
    var draw = Request.Form["draw"];
    var start = Request.Form["start"].ToString();
    var length = Request.Form["length"].ToString();
    var sortColumn = Request.Form["columns[" + Request.Form["order[0][column]"] + "][name]"];
    var sortColumnDir = Request.Form["order[0][dir]"];
    var searchValue = Request.Form["search[value]"];

    //Paging Size (10,20,50,100)    
    int pageSize = length != null ? Convert.ToInt32(length) : 0;
    int skip = start != null ? Convert.ToInt32(start) : 0;
    int recordsTotal = 0;

    // Getting all Customer data    
    var dataList = (from l in _Db.Ledger
                    select new Ledger
                    {
                        Id=l.Id,
                        Name = l.Name,
                        Address = l.Address,
                    }).ToList();

    // filter data
    if (ledger.SearchLedgerType != null)
        dataList = dataList.Where(d => d.LedgerType.Trim() == ((LedgerType)Convert.ToInt32(ledger.SearchLedgerType)).ToString()).ToList();

    //Sorting    
    if (!(string.IsNullOrEmpty(sortColumn) && string.IsNullOrEmpty(sortColumnDir)))
    {
        var propertyInfo = typeof(Ledger).GetProperty(sortColumn);
        if (propertyInfo != null)
        {
            if (sortColumnDir == "asc")
                dataList = dataList.OrderBy(x => propertyInfo.GetValue(x, null)).ToList();
            else
                dataList = dataList.OrderByDescending(x => propertyInfo.GetValue(x, null)).ToList();
        }
    }

    //Search    
    if (!string.IsNullOrEmpty(searchValue))
        dataList = dataList.Where(m => m.Name.ToLower().Contains(searchValue.ToString().ToLower())).ToList();

    //total number of rows count     
    recordsTotal = dataList.Count();

    //Paging     
    var data = dataList.Skip(skip).Take(pageSize).ToList();

    //Returning Json Data
    return Json(new { draw = draw, recordsFiltered = recordsTotal, recordsTotal = recordsTotal, data = data });
}

现在，这是 print 和 pageLength 过滤器的代码，但在输出中我只得到了 print 选项而不是 pageLength 选项，以便更清楚地看到该输出的图像

如果我从上面的代码中删除打印代码，即

dom: 'Bfrtip',
            buttons: [
                {
                    extend: 'print',
                    exportOptions: {
                        columns: [0, 1, 2]
                    },
                    className: 'btn btn-default btn-xs glyphicon glyphicon-print',
                    footer: true
                }
            ],

然后我得到下面的图像结果

请帮我解决这个问题。

谢谢。

Answer 1

将dom: 'Bfrtip' 替换为dom: 'Blfrtip'