在 asp.net MVC 中使用多过滤器数据表答案

【问题标题】：Using multi filter datatables in asp.net MVC在 asp.net MVC 中使用多过滤器数据表
【发布时间】：2019-04-07 19:43:34
【问题描述】：

我正在尝试在 asp.net 的数据表中实现multiple filters，但是当我搜索一个值时，我的表没有更新。

我按照该网站的官方示例进行操作，但没有成功。这是我正在使用的源代码。

视图上的 JS

$('#students tfoot th').each( function () {
                var title = $(this).text();
                if (title !== "") {
                    $(this).html('<input type="text" class="form-control form-control-sm" style="width: 100%" placeholder="' + title + '" />');
                } else {
                    $(this).html('<div class="text-center">-</div>');
                }
            } );

            tabela.columns().every( function () {
                var that = this;    
                $( 'input', this.header() ).on( 'keydown', function (ev) {
                    if (ev.keyCode == 13) { //only on enter keypress (code 13)
                        that
                            .search( this.value )
                            .draw();
                    }
                } );
            } );

控制器上的操作

[HttpPost]
        public JsonResult Listar2()
        {
            var search = Request.Form.GetValues("search[value]")?[0];

            var list = db.Students;

            if (!string.IsNullOrEmpty(search))
            {
                list = list.Where(m => m.name.ToLower().Contains(search.ToLower()) || m.class.ToLower().Contains(search.ToLower()));
            }

            var draw = Request.Form.GetValues("draw")?[0];
            var start = Request.Form.GetValues("start")?[0];
            var length = Request.Form.GetValues("length")?[0];

            var width = length != null ? Convert.ToInt32(length) : 0;
            var skip = start != null ? Convert.ToInt32(start) : 0;

            var totalRecords = list.Count();
            var resultFinal = list.Skip(skip).Take(width).ToList();

            return Json(new
            {
                data = resultFinal,
                draw,
                recordsFiltered = totalRecords,
                recordsTotal = totalRecords
            });
        }

【问题讨论】：

您检查浏览器控制台是否有任何错误？另外，可能有错字tablela.columns 而不是table.columns
@MohsinMehmood 是的，控制台没有错误。此外，每次输入搜索时，操作都会收到一个请求，但搜索不会发生，因为值变为空。
我没有看到在输入搜索文本时调用 api 方法的任何代码。您分享的多搜索演示网址只是对数据表列执行客户端搜索。
@MohsinMehmood 表格生成器源代码：gist.github.com/leomarcamargo/dc6032a5fc9c9fc9c6b528462dd539b9
@LeomardeSouza 为什么你的方法是Listar2 而你的ajax 请求方法是Listar？你确定你在服务器上调用了正确的方法吗？

标签： asp.net asp.net-mvc asp.net-mvc-4 datatables

【解决方案1】：

我不知道你想完成什么。官方示例使用 JavaScript 对已插入 HTML 的数据表进行排序。您应该首先加载所有条目，将它们传递给视图，然后这个脚本应该过滤这些条目

【讨论】：

我不知道你想完成什么官方示例使用JavaScript对已经插入HTML的数据表进行排序。您应该首先加载所有条目，将它们传递给视图，然后此脚本应该过滤这些条目。在上面的 cmets 中，您有一个将数据加载到视图中的示例链接。简单搜索有效，但这种类型的多重搜索无效。