TreeGrid cannot set the theme property dynamically

[qadramParticipant]

Hello,
I’m trying to set the theme property for a JqxTreeGrid dynamically, and while it works with other controls I have tested, it doesn’t work with JqxTreeGrid.
I’m getting an error:

TypeError: Cannot read property 'host' of null
c.<computed>.propertyChangedHandler
node_modules/babel-loader/lib/index.js??ref--6-oneOf-2!/Users/ttm/treetest/node_modules/jqwidgets-scripts/jqwidgets/jqxtreegrid.js:1338
  1335 |   f._render();
  1336 | } else {
  1337 |   if (l == "theme") {
> 1338 |     a.jqx.utilities.setTheme(c, k, f.base.host);
       | ^  1339 |     f.vScrollBar.jqxScrollBar({
  1340 |       theme: f.theme
  1341 |     });

This is my code:

import * as React from 'react';

import 'jqwidgets-scripts/jqwidgets/styles/jqx.base.css';
import 'jqwidgets-scripts/jqwidgets/styles/jqx.material-purple.css';
import 'jqwidgets-scripts/jqwidgets/styles/jqx.black.css';

import JqxButton from 'jqwidgets-scripts/jqwidgets-react-tsx/jqxbuttons';
import JqxTreeGrid from 'jqwidgets-scripts/jqwidgets-react-tsx/jqxtreegrid';
import { createRef } from 'react';

class App extends React.PureComponent<{}> {

    constructor(props: {}) {
        super(props);

        this.onclick = this.onclick.bind(this);
    }

    private tree = createRef<JqxTreeGrid>();

    public onclick()
    {        
        this.tree.current!.setOptions({theme:'material-purple'});
    }

    public render() {
        return (
            <div>                
                <JqxTreeGrid
                width={850} ref={this.tree} 
                pageable={true}  sortable={true} theme={'black'}
                 editable={true} />
            <br/>
            <JqxButton width={100} height={100} onClick={this.onclick} />
            </div>
        );
    }
}

export default App;

[MartinParticipant]

Hello qadram,

Thank you for the feedback!
It seems that this is an issue. We will create a work item for this case.

Best Regards,
Martin

jQWidgets Team
https://www.jqwidgets.com/

[Author]

Posts