Unable to get HOT instance on react wrapper of Handsontable

Tags: #<Tag:0x00007f8b2b777730>
#1

Hi there,

I am trying to use the filters plugin since I want to pre-set filter values on load of the table.
Before that I need to reference the instance of the handsontable, I am using React 16 with a React wrapper of handsontable, I tried follow this page https://handsontable.com/docs/7.1.1/frameworks-wrapper-for-react-hot-reference.html , but I keep getting error saying:
TypeError: this.hotTableComponent.current is null

What I did was:
constructor(props) {
super(props);
this.hotTableComponent = React.createRef();
}
in render:
< HotTable ref={this.hotTableComponent} >

Then, I tried access the plugin:
const filtersPlugin = this.hotTableComponent.current.hotInstance.getPlugin(‘filters’);

I tried console log this.hotTableComponent
I get an object of current null, as below:
current: null
: {…}
defineGetter: function defineGetter()
defineSetter: function defineSetter()
lookupGetter: function lookupGetter()
lookupSetter: function lookupSetter()
proto:
constructor: function Object()
hasOwnProperty: function hasOwnProperty()
isPrototypeOf: function isPrototypeOf()
propertyIsEnumerable: function propertyIsEnumerable()
toLocaleString: function toLocaleString()
toSource: function toSource()
toString: function toString()
valueOf: function valueOf()
<get proto()>: function proto()
<set proto()>: function proto()

Can you give me any help?

Thank you
Terry

#2

Hey Terry,

I guess that you’re missing the id.

Example https://jsfiddle.net/handsoncode/1cw9fpru/

#3

Thank you for that. I just want to pre-set the filter value so that as long as the table loads the filter already being selected, can you show me how would you do that in a HOT React Wrapper?

#4

Hi @marius.editoiu

here’s a set up filter example for React https://jsfiddle.net/dgq91zoh/

Here’s a list of keys used by Filters plugin https://handsontable.com/docs/7.2.1/Filters.html#addCondition that will help you to create a condition.

Once you set up the condition you need to call the filter() method to repaint the table.

1 Like
#5

Thank you very much.

#6