Code in hooks stops associated function from working

Tags: #<Tag:0x00007f8b23d8c3a8>

Hi there

Basically, when I add code to an event hook function associated with the event stops working.

For example, I want to set a flag when a filter is applied to a column, so I register the hook afterFilter and have it set a page state value when a filter is completed. However, the presence of code in that hook prevents the filter from working, and nothing happens after I enter data in the filter, and click OK.

I assume I’m correctly doing things, but am open to the possibility that I’m doing it wrong. Thanks in advance.

Here’s an example. I’m using react, by the way.

  componentDidMount() {
       const hti = this.hotTableComponent.current.hotInstance;
       hti.addHook("afterFilter", this.afterFilter);
  }

afterFilter = (e) => {
    //comment out the line below to have filters work
    this.setState({ gridIsFiltered: true });
  };

The Grid settings are:

  hotSettings = () => {
    return {
      licenseKey: "non-commercial-and-evaluation",
      data: this.props.values.dataToView,
      colHeaders: this.colHeaders(),
      colWidths: this.colWidths(),
      columns: this.columns(),
      rowHeaders: true,
      readOnly: false,
      manualColumnMove: true,
      manualRowMove: true,
      manualColumnResize: true,
      manualRowResize: true,
      filters: true,
      dropdownMenu: [
        "filter_by_condition",
        "filter_by_value",
        "filter_action_bar", 
      ],
      columnSorting: true,
      contextMenu: this.contextMenus(),
      autoWrapRow: true,
    };

Hi @andy

some time ago, I have reported the same issue on our Github board https://github.com/handsontable/handsontable/issues/7567

I will notify you once we fix it. You can also leave a comment there to be notified once a developer is attached to the task.

1 Like

That’s helpful to know. Thanks for taking the time to reply. It also pretty much sinks my plans to use HandsonTable for my project.

This issue was solved in v.12.0.0.