Question

我想在一个表的某个列中搜索没有数据插件并使用jquery或javascript的一系列数字。
最小值的文本框和最大值的文本框。

我对某个列进行了简单搜索，但我不知道如何搜索某个范围。

javascript：

function SFNAAB_Code() {

    var input, filter, table, tr, td, i;
    input = document.getElementById("SFNAAB_CodeInput");
    filter = input.value.toUpperCase();
    table = document.getElementById("myTable");
    tr = table.getElementsByTagName("tr");

    for (i = 0; i < tr.length; i++) {
        td = tr[i].getElementsByTagName("td")[1];
        if (td) {
            if (td.innerHTML.toUpperCase().indexOf(filter) > -1) {
                tr[i].style.display = "";
            } else {
                tr[i].style.display = "none";
            }
        }
    }
}

HTML：

<input type="text" id="SFNAAB_CodeInput" onkeyup="SFNAAB_Code()" 
placeholder="Search By NAAB Code...">

<table id="myTable">
    <thead>
    <tr>
        <th>
            @Html.DisplayNameFor(model => model.RegNo)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.NAAB_CODE)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.NAME)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.ICC)
        </th>
    </tr>
    </thead>
    <tbody>
    @foreach (var item in Model)
    {
        <tr>
            <td>
                @Html.DisplayFor(modelItem => item.RegNo)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.NAAB_CODE)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.NAME)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.ICC)
            </td>
        </tr>
    }
        </tbody>
  </table>

Answer 1

使用以下选项对数据表插件进行范围搜索来解决它：

var table = $('#myTable').DataTable({
        paging: false,
        info: false
    });

并从sDOM中删除了f 继承人代码：

$.fn.dataTable.ext.search.push(
function( settings, data, dataIndex ) {
    var min = parseInt( $('#min').val(), 10 );
    var max = parseInt( $('#max').val(), 10 );
    var age = parseFloat( data[3] ) || 0;

    if ( ( isNaN( min ) && isNaN( max ) ) ||
         ( isNaN( min ) && age <= max ) ||
         ( min <= age   && isNaN( max ) ) ||
         ( min <= age   && age <= max ) )
    {
        return true;
    }
    return false;
}
);

$(document).ready(function() {
var table = $('#example').DataTable({
    paging: false,
    info: false
});

$('#min, #max').keyup( function() {
    table.draw();
} );
} );

datatables Custom filtering - range search

搜索特定列中的一系列数字，并隐藏不在

1 个答案: