向表格列添加过滤器答案

【问题标题】：Add a filter to a table column向表格列添加过滤器
【发布时间】：2020-11-17 10:24:15
【问题描述】：

将过滤器添加到表列（状态）的最简单方法是什么？我发现了不同的东西，但它们都建议使用搜索框之类的东西，但我不希望那样。我尝试了另一件事，但没有奏效。下面是我的代码，没有任何过滤器。非常感谢您的帮助。

控制器

public ActionResult ViewAllTasks()
        {
            HelpDeskDBHandle dbhandle = new HelpDeskDBHandle();
            return View(dbhandle.GetITTasksList());
        }

        //LIST IT TASKS
        public JsonResult ListITTasks()
        {
            HelpDeskDBHandle hdDB = new HelpDeskDBHandle();
            return Json(hdDB.GetITTasksList(), JsonRequestBehavior.AllowGet);
        }

查看

@*IT TASKS PAGE----------------------------------------------------------------------------------------*@

@model IEnumerable<HelpDeskSupport.Models.ITTasksModel>

@{
    Layout = null;
}

<head>
    <meta name="viewport" content="width=device-width" />
    <title>ViewAllTasks</title>

    <script src="~/Scripts/ITTasksJS.js"></script>
</head>

<div class="container">
    <h2>IT Tasks</h2>
    <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#myModal" 
                  onclick="clearTextBox();">Add New Task</button><br /><br />

    <table class="display table table-striped table-bordered" id="knowledgeTable">
        <thead>
            <tr>
                <th>
                    @Html.DisplayNameFor(model => model.ITNumber)
                </th>
                <th>
                    @Html.DisplayNameFor(model => model.ITDescription)
                </th>
                <th>
                    @Html.DisplayNameFor(model => model.ITEnterDate)
                </th>
                <th>
                    @Html.DisplayNameFor(model => model.ITAssignedTo)
                </th>
                <th>
                    @Html.DisplayNameFor(model => model.ITEstimatedCompletion)
                </th>
                <th>
                    @Html.DisplayNameFor(model => model.ITPriority)
                </th>
                <th>
                    @Html.DisplayNameFor(model => model.ITFrom)
                </th>
                <th>
                    @Html.DisplayNameFor(model => model.ITStatus)
                </th>
            </tr>
        </thead>

        <tbody class="tbody">
            @foreach (var item in Model)
            {
                <tr>
                    <td>
                        @Html.DisplayFor(modelItem => item.ITNumber)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.ITDescription)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.ITEnterDate)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.ITAssignedTo)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.ITEstimatedCompletion)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.ITPriority)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.ITFrom)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.ITStatus)
                    </td>
                </tr>
            }
        </tbody>
    </table>
</div>

JAVASCRIPT

//Load Data in Table when documents is ready
$(document).ready(function () {
    loadData();
});

//Load Data function
function loadData() {
    $.ajax({
        url: "/Tickets/ListITTasks",
        type: "GET",
        contentType: "application/json;charset=utf-8",
        dataType: "json",
        success: function (result) {
            var html = '';
            $.each(result, function (key, item) {
                html += '<tr>';
                html += '<td>' + item.ITNumber + '</td>';
                html += '<td>' + item.ITDescription + '</td>';
                html += '<td>' + item.ITEnterDate + '</td>';
                html += '<td>' + item.ITAssignedTo + '</td>';
                html += '<td>' + item.ITEstimatedCompletion + '</td>';
                html += '<td>' + item.ITPriority + '</td>';
                html += '<td>' + item.ITFrom + '</td>';
                html += '<td>' + item.ITStatus + '</td>';
                html += '<td><a href="#" onclick="return getbyTicketNumber(' + item.ITNumber + 
               ')">Edit</a> | <a href="#" onclick="DeleteItTask(' + item.ITNumber + ')">Delete</a></td>';
                html += '</tr>';
            });
            $('.tbody').html(html);
            alert("Successful Loaddata ITTASK");
        },
        error: function (errormessage) {
            alert(errormessage.responseText);
        }
    });
}

再次感谢！！！

【问题讨论】：

ITStatus 的可能值是多少？
Closed 或 open 将是 status 的值。

标签： javascript c# html jquery model-view-controller

【解决方案1】：

添加您的请求网址状态值，例如：

url: "/Tickets/ListITTasks?status=0",

我假设 Status 道具接受 int。可以改成字符串。

然后添加您的控制器功能参数，如：

public JsonResult ListITTasks(int status){}

然后在您的存储库中创建新的（或更新GetITTasksList()）函数并接受 int 参数。并使用 PredicateBuilder 或 .Where() 编写您的 sql 或 linq 过滤器。然后当然返回结果。

【讨论】：

您好，我不确定您的回答。我是 MVC 的新手。另外，我想显示表中的所有数据，然后仅在他们决定时对其进行过滤。我想在列顶部添加一个过滤器。
如果您需要从 API 过滤，这个答案会对您有所帮助，但您需要从首页过滤，那么您将使用一些 Js 方法。首先，您需要做出决定。
如果你需要 Js 方法：我不确定但是；为用户的状态选择声明一个变量，然后在您的 @foreach(Model.filter(x=> x.ITStatus == statusChoice) 中的变量项) 中。这将为您提供过滤后的数据集。
你有控制器、视图和javascript的示例代码吗？我尝试了此链接中的内容，但它不起作用...stackoverflow.com/questions/39495363/…