搜索特定列中的数字范围并隐藏不在范围内的行

问题描述：

我想要搜索表格的某一列，查找不带数据表插件的数字范围并使用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>

我认为你将不得不为每个列TD进行搜索，然后或在您若检查 – dementis

你是说你每个条件要'td.innerHTML .toUpperCase（）。indexOf（filter）> -1'是范围检查而不是存在检查？ – Taplar

@Taplar是！，我如何改变它有两个文本框的最小值和最大值？ –

答

解决它使用范围的搜索数据表插件使用这些选项：

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

搜索特定列中的数字范围并隐藏不在范围内的行

相关推荐