Ag grid 如何在Ag网格中使用多条件文本输入进行过滤？

使用ag grid enterprise v5.4.0

与Excel数据分析一样，创建多个textFilter输入，例如：[包含]filterText和[不包含]filterText 2

但单击[应用筛选器]后，filterType2和filterText都未定义

---

我相信你正在努力做的事情最好是通过以下方法实现的。这允许您完全控制过滤器的痛苦，无论您是否在企业中。以下是每个自定义筛选器所需的方法：

function CustomFilter() {}

CustomFilter.prototype.init = function (params) {
    //Put any initial functions you need here (such as setting values to null)
};

CustomFilter.prototype.getGui = function () {
    //return a string of HTML or a DOM element/node
};

CustomFilter.prototype.doesFilterPass = function (params) {
    //Logic for your custom Filter
    //return True if the row should display, false otherwise
};

CustomFilter.prototype.isFilterActive = function () {
    //logic for displaying the filter icon in the header
};

CustomFilter.prototype.getModel = function() {
    //store the filter state
};

CustomFilter.prototype.setModel = function(model) {
    //restore the filter state here
};

以下是如何实现“包含x但不包含y”过滤器的示例：

函数双过滤器（）{
}
DoubleFilter.prototype.init=函数（参数）{
this.valueGetter=params.valueGetter；
this.filterText=null；
这个.setupGui（params）；
};
//ag Grid没有调用，只是为了帮助我们进行设置
DoubleFilter.prototype.setupGui=函数（参数）{
this.gui=document.createElement（'div'）；
this.gui.innerHTML=
'' +
“自定义运动员过滤器”+
'包括：'+
'排除：'+
'';
//将侦听器添加到两个文本字段
this.eIncludesText=this.gui.querySelector（'includeText'）；
this.eIncludesText.addEventListener（“已更改”，listener）；
this.eIncludesText.addEventListener（“粘贴”，listener）；
this.eIncludesText.addEventListener（“输入”，侦听器）；
//IE不会为特殊键（如删除、退格）触发更改，因此需要
//再听听这个
this.eiincludestext.addEventListener（“keydown”，listener）；
this.eIncludesText.addEventListener（“keyup”，listener）；
this.eExcludesText=this.gui.querySelector（'excludesText'）；
this.eeexcludestext.addEventListener（“已更改”，listener2）；
此.eeExcludeText.addEventListener（“粘贴”，listener2）；
this.eExcludesText.addEventListener（“输入”，listener2）；
//IE不会为特殊键（如删除、退格）触发更改，因此需要
//再听听这个
this.eeexcludestext.addEventListener（“keydown”，listener2）；
this.eeexcludestext.addEventListener（“键控”，listener2）；
var=这个；
函数侦听器（事件）{
that.includeText=event.target.value；
params.filterChangedCallback（）；
}
函数listener2（事件）{
that.excludesText=event.target.value；
params.filterChangedCallback（）；
}
};
DoubleFilter.prototype.getGui=函数（）{
返回这个.gui；
};
DoubleFilter.prototype.doesFilterPass=函数（参数）{
var通过=真；
var valueGetter=this.valueGetter；
var include=this.includeText；
var exclude=this.excludesText；
var value=valueGetter（params.toString（）.toLowerCase（）；
返回值.indexOf（include）>=0&（value.indexOf（exclude）<0 | | exclude==”）；
};
DoubleFilter.prototype.isFilterActive=函数（）{
返回（this.includeText！==null&&this.includeText！==undefined&&this.includeText！==“”）
||（this.excludesText！==null和this.excludesText！==undefined和this.excludesText！=''）；
};
DoubleFilter.prototype.getModel=函数（）{
var模型={
包括：this.includeText.value，
排除：this.excludesText.value
};
收益模型；
};
DoubleFilter.prototype.setModel=函数（模型）{
this.eIncludesText.value=model.includes；
this.eeexcludestext.value=model.excludes；
};

这是一本书。我将过滤器放在运动员栏上，但创建后，

DoubleFilter

可以应用于任何栏

编辑：

---

我意识到您在问题中要求使用一个相当通用的双过滤器，并以“包含和排除”为例。这里有一个更通用的双过滤器。

我相信您要做的最好是使用。这允许您完全控制过滤器的痛苦，无论您是否在企业中。以下是每个自定义筛选器所需的方法：

function CustomFilter() {}

CustomFilter.prototype.init = function (params) {
    //Put any initial functions you need here (such as setting values to null)
};

CustomFilter.prototype.getGui = function () {
    //return a string of HTML or a DOM element/node
};

CustomFilter.prototype.doesFilterPass = function (params) {
    //Logic for your custom Filter
    //return True if the row should display, false otherwise
};

CustomFilter.prototype.isFilterActive = function () {
    //logic for displaying the filter icon in the header
};

CustomFilter.prototype.getModel = function() {
    //store the filter state
};

CustomFilter.prototype.setModel = function(model) {
    //restore the filter state here
};

以下是如何实现“包含x但不包含y”过滤器的示例：

函数双过滤器（）{
}
DoubleFilter.prototype.init=函数（参数）{
this.valueGetter=params.valueGetter；
this.filterText=null；
这个.setupGui（params）；
};
//ag Grid没有调用，只是为了帮助我们进行设置
DoubleFilter.prototype.setupGui=函数（参数）{
this.gui=document.createElement（'div'）；
this.gui.innerHTML=
'' +
“自定义运动员过滤器”+
'包括：'+
'排除：'+
'';
//将侦听器添加到两个文本字段
this.eIncludesText=this.gui.querySelector（'includeText'）；
this.eIncludesText.addEventListener（“已更改”，listener）；
this.eIncludesText.addEventListener（“粘贴”，listener）；
this.eIncludesText.addEventListener（“输入”，侦听器）；
//IE不会为特殊键（如删除、退格）触发更改，因此需要
//再听听这个
this.eiincludestext.addEventListener（“keydown”，listener）；
this.eIncludesText.addEventListener（“keyup”，listener）；
this.eExcludesText=this.gui.querySelector（'excludesText'）；
this.eeexcludestext.addEventListener（“已更改”，listener2）；
此.eeExcludeText.addEventListener（“粘贴”，listener2）；
this.eExcludesText.addEventListener（“输入”，listener2）；
//IE不会为特殊键（如删除、退格）触发更改，因此需要
//再听听这个
this.eeexcludestext.addEventListener（“keydown”，listener2）；
this.eeexcludestext.addEventListener（“键控”，listener2）；
var=这个；
函数侦听器（事件）{
that.includeText=event.target.value；
params.filterChangedCallback（）；
}
函数listener2（事件）{
that.excludesText=event.target.value；
params.filterChangedCallback（）；
}
};
DoubleFilter.prototype.getGui=函数（）{
返回这个.gui；
};
DoubleFilter.prototype.doesFilterPass=