如何开发搜索选项以在 MVC 视图表中按列搜索

Question

是否有一种按列搜索 .cshtml 表中数据的正确方法。每列必须有一个文本框。 我用javascript试过了，下面是我的代码。但它不起作用。谁能指导我正确地做到这一点？

        function searchSup()
    {
        $('#example thead th').each
            ( function ()
                {
                    var title = $(this).text();
                    $(this).html('<input type="text" id="SupInput" placeholder="Search ' + title + '" class="form-control"/>');
                } 
            );

        var input, filter, table, tr, td, i;
        input = document.getElementById("SupInput");
        filter = input.value.toUpperCase();
        table = document.getElementById("SupTable");
        tr = table.getElementsByTagName("tr");
            for (i = 0; i < tr.length; i++) 
                {
                    var supname = tr[i].cells[0].textContent.toUpperCase();
                    var contact = tr[i].cells[1].textContent.toUpperCase();
                    var address = tr[i].cells[2].textContent.toUpperCase();
                    var telephone = tr[i].cells[3].textContent.toUpperCase();
                    if (td) 
                        {
                            if (supname.indexOf(filter) > -1 || contact.indexOf(filter) > -1 || address.indexOf(filter) > -1 || telephone.indexOf(filter) > -1) 
                                {
                                    tr[i].style.display = "";
                                } 
                                else 
                                {
                                    tr[i].style.display = "none";
                                }
                        }
                }   
    }

我在 tr = table.getElementsByTagName("tr"); 说 getElementsByTagName value is null 这一行中遇到错误

谁能帮帮我？

Answer 1

您可以使用我成功集成到一些 ASP.NET MVC 项目的jQuery DataTable with Custom Column Search 没有问题。

还有一些其他的演示，但首先前面的页面可能对你来说已经足够了。

DataTable (Server side)

希望这会有所帮助...