Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Tree and Select with Material UI checkbox #88

aubsparrow started this conversation in General
Discussion options

I am trying to create a table with select & tree and I'm using Material UI checkboxes. Are there any examples of how to do that? The examples in the documentation only work without a tree.

The example will select the parent but not the children.
image

You must be logged in to vote

Replies: 2 comments 1 reply

Comment options

Start with this one https://react-table-library.com/?path=/docs/mixing-features-tree-select--base and exchange the default select checkbox with MUI checkbox which is demonstrated over here https://react-table-library.com/?path=/docs/features-select--custom-checkbox-material-ui Does this help?

You must be logged in to vote
1 reply
Comment options

The problem I am running into with the provided material ui cusotm checkbox is how to make the parent rows in the tree display proper indeterminate state and check all the child rows when checked. Does that make sense?
image

What is the exact structure of select.state?

Comment options

This is what I ended up having to put in the onChange method:
onChange={() => { console.log(item); if (item.nodes?.length !== undefined) { if (item.nodes?.length > 0) { const ids = new Array<string>(); ids.push(item.id); for (const sat of item.nodes) { ids.push(sat.toString()); } if (select.state.ids.includes(item.id)) { select.fns.onRemoveByIds(ids); } else { select.fns.onAddByIds(ids, {}); } } } else { select.fns.onToggleById(item.id); }

You must be logged in to vote
0 replies
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet

AltStyle によって変換されたページ (->オリジナル) /