jQuery DataTables - 调用多个插件？ （日期范围/范围搜索）

Question

如何将这 2 个插件组合到我的 jquery 数据表设置中？

当我删除其中一个时，剩下的一个有效（例如：删除日期范围，使用数字进行范围搜索有效）。我在下面链接了两者。

Date Range Plug-in

Range Search Plug-in

调用 DataTable 后，我将调用 table.draw() 以根据我对范围选择器或日期选择器的输入更新所有内容。

$(document).ready(function(){
    var table = $('#example').DataTable();
}

我在想我的错误是我设置 $.fn.dataTable.ext.search.push 的方式 - 我已经检查了无数次我的 ID 是正确的而且数据索引也是正确的。如前所述，我删除了其中一个插件，另一个有效。我尝试了在网上找到的其他几个示例，但一无所获。

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

    var minDateTime = minDate.val();
    var maxDateTime = maxDate.val();
    var date = new Date( data[1] );

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

    if (
        ( minDateTime === null && maxDateTime === null ) ||
        ( minDateTime === null && date <= maxDateTime ) ||
        ( minDateTime <= date   && maxDateTime === null ) ||
        ( minDateTime <= date   && date <= maxDateTime )
    ) {
        return true;
    }
    return false;
}
);

Answer 1

您需要将数字范围检查器的逻辑与日期范围检查器的逻辑结合起来。您希望在单个 if 语句中评估所有 4 个输入字段以确定是否应隐藏或显示记录。

目前它们作为 2 个独立的代码段运行，一个接一个。

将它们与 && 运算符组合：

if (((isNaN(min) && isNaN(max)) ||
    (isNaN(min) && risk <= max) ||
    (min <= risk && isNaN(max)) ||
    (min <= risk && risk <= max)) &&
  (
    (minDateTime === null && maxDateTime === null) ||
    (minDateTime === null && date <= maxDateTime) ||
    (minDateTime <= date && maxDateTime === null) ||
    (minDateTime <= date && date <= maxDateTime)
  ))

{
  return true;
} else {
  return false;
}

---

以上逻辑可能难以阅读 - 因此等效方法如下：

var withinRisk = ( 
    ( isNaN( min ) && isNaN( max ) ) ||
    ( isNaN( min ) && risk <= max ) ||
    ( min <= risk  && isNaN( max ) ) ||
    ( min <= risk  && risk <= max ) 
);

var withinDates = (
    ( minDateTime === null && maxDateTime === null ) ||
    ( minDateTime === null && date <= maxDateTime ) ||
    ( minDateTime <= date  && maxDateTime === null ) ||
    ( minDateTime <= date  && date <= maxDateTime )
); 

if (withinRisk && withinDates)  {
  return true;
} else {
  return false; 
}

在这里，我们将两个范围检查分开，只在最后合并它们。