applyfilter during runtime seems to not properly filter data

Question

I am using jqxgrid and needed to implement filtering. I noticed that it had filtering so i was looking into how i could leverage the pre-existing tools. For a point of reference: https://www.jqwidgets.com/angular-components-documentation/documentation/jqxgrid/angular-grid-filtering.htm?search=

So i implement an input box with a button which fires the event: filterClick() and properly get the right data to create and apply the filter:

Info: isFilterSet is a bool, assigned to jqxGrid's filterable field. grid is a reference to jqxgrid filterText is a reference to the inputbox

filterClicked(): void {
  let filtergroup = new jqx.filter();
  let filter_or_operator = "or";
  let filterCondition = "contains";
  let filterValue = this.filterText.nativeElement.value;  //confirmed.
  let f = filter.createfilter("stringfilter", filterValue, filterCondition);

  for (let col in this.datafields){
     // confirmed col.name == columnname
     this.grid.addfilter(col.name, filter);
  }

  this.isFilterSet = true;
  this.grid.applyfilters();
}

I logged out the information, but the grid itself doesnt seem to update.

Is there something I am doing wrong? The grid itself doesnt update, but i was following along and didnt see any jumping out at me. I also attempted to move the instantiation of the filtergroup to inside the array for the case of maybe it didnt like sharing the object.

I get no errors

Answer 1

Since I did not get this to work, I handled filtering on my own by keeping a copy of the data, but updating the dataadapter with a new array which would fire onchange.

setDataAdapter () : void {
    // this.data is the base array object containing all info
    let filterValue : string = "";
    if (this.filterText) filterValue = this.filterText.nativeElement.value;
    let reg = RegExp(filterValue, "ig");

    let src: any =
    {
      // if the input is empty, then it would just use data, otherwise it would filter.   My filter is only filtering strings, is case inspecific and tests the entire string.
      localdata: filterValue == "" ? this.data : this.data.filter( row => {
        for ( let key of Object.keys(row)){
          let content = row[key];
          if (typeof content === "string" && reg.test(content)){
            return true;
          }
        }
        return false;
      }),
      datatype: 'array',
      datafields: this.dataFields
    };

    this.grid.clearselection();
    this.dataAdapter = new jqx.dataAdapter(src);
  }