KevinVandy/material-react-table

Column editSelectOptions array with label and value do not select label in edit mode

SanjayKumarRahul opened this issue · 0 comments

material-react-table version

2.13.0

react & react-dom versions

18.2.0 & 18.2.0

Describe the bug and the steps to reproduce it

Define a array with label and value:
export const usStates = [ {label:'Ohio', value:'OH'}, {label:'Rhode Island', value:'RI'}, ];

Use this array into column:
{ accessorKey: 'state', header: 'State', editVariant: 'select', editSelectOptions: usStates, muiEditTextFieldProps: { select: true, error: !!validationErrors?.state, helperText: validationErrors?.state, },

Table data:

image

When in edit mode:

The problem is label is not selected from dropdown option.

image

When dropdown is clicked the label is shown as it should:
image

Minimal, Reproducible Example - (Optional, but Recommended)

Code Sand Box Example

https://codesandbox.io/p/devbox/upbeat-lamarr-nwfmp8

Screenshots or Videos (Optional)

No response

Do you intend to try to help solve this bug with your own PR?

None

Terms

  • I understand that if my bug cannot be reliably reproduced in a debuggable environment, it will probably not be fixed and this issue may even be closed.