griddle-react: How can I externalize the rows settings from the settings menu

Question

I want to separate the row settings from the separate settings menu in Griddle.

The DataTables library has a good example on its homepage. I essentially want to recreate the DataTables layout but with the Griddle library

https://www.datatables.net/

http://griddlegriddle.github.io/Griddle/quickstart.html

Answer 1

Would it be possible to create another component that controls the results per page outside of Griddle?

Example:

render() {
  <div>
    <SomeSelectComponent onChange={this.setRowsPerPage} >
      ...
    </SomeSelectComponent>
    <Griddle ... rowsPerPage={this.state.rowsPerPage}/>
  </div>
}

setRowsPerPage(value) {
  this.setState({rowsPerPage: value})
}

This is less than ideal and we've been working on making this a bit nicer to where an implementer can customize all the components/render structure and even toss components that Griddle knows nothing about into it's render. We've been breaking up the rendering logic from the grid's state which allows for some nicer customizations.