Question

这可能是一个直截了当的问题，但我正在努力实施我找到的解决方案。缺乏JavaScript经验。

我试图在DataTables表中实现自定义搜索，但我只在启动时触发该功能，而不是在搜索框中输入。

这是我尝试搜索的解决方案。

$.fn.dataTable.ext.search.push(function( settings, data, dataIndex ) {
   var term = $('.dataTables_filter input').val().toLowerCase()
   for (var i=0, l=data.length; i<l; i++) {
     if ($(data[i], 'label').text().toLowerCase().indexOf(term) == 0 ) return true
   }
   return false
})

我已在$(document).ready(function(){之外尝试过，但它不起作用。

这是DataTables表的初始化。

$(document).ready(function(){
.
.
.
    var oTable = $('#desktop_table').dataTable({
        "bInfo": false,
        "iDisplayLength": 15,
        "aLengthMenu": [15, 30, 50, 100],
        "sPaginationType": "full_numbers",
        "sDom": '<"top"i>frt<"bottom"lp><"clear">',
        "oLanguage": {
            "sLengthMenu": "Show _MENU_"
        },
        "sStripeOdd": "odd",
        "sStripeEven": "even",
        "rowReorder": true,
    });

}

预览我的DataTables表格中的单元格

<td>
    <div class="plCell_desktop">
        <input type="radio" class="" data-lnk_id="414107671" data-group="RUTH">
        <label for="414107671">RUTH</label>
    </div>
</td>

Answer 1

$('input[type="radio"]').change(function () {
$.fn.dataTable.ext.search.push(function( settings, data, dataIndex ) {
   var term = $('.dataTables_filter input').val().toLowerCase()
   for (var i=0, l=data.length; i<l; i++) {
     if ($(data[i], 'label').text().toLowerCase().indexOf(term) == 0 ) 
      return true;
   }
   return false;
});
var table = $('#desktop_table').DataTable();
    table.draw();
});

DataTable自定义搜索实现

1 个答案: