Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Select][joy] value is missing in onChange event #37128

Closed
siriwatknp opened this issue May 1, 2023 · 2 comments
Closed

[Select][joy] value is missing in onChange event #37128

siriwatknp opened this issue May 1, 2023 · 2 comments
Labels
component: select This is the name of the generic UI component, not the React module! duplicate This issue or pull request already exists enhancement This is not a bug, nor a new feature package: base-ui Specific to @mui/base package: joy-ui Specific to @mui/joy

Comments

@siriwatknp
Copy link
Member

To have the same experience as the native select and Material UI's select:

<Select onChange={event => {
  event.target.value
}}>

Temporary solution

We could do something similar to Material UI's Select by applying the value to the event.taget:

if (onChange) {
  // Redefine target to allow name and value to be read.
  // This allows seamless integration with the most popular form libraries.
  // https://github.com/mui/material-ui/issues/13485#issuecomment-676048492
  // Clone the event to not override `target` of the original event.
  const nativeEvent = event.nativeEvent || event;
  const clonedEvent = new nativeEvent.constructor(nativeEvent.type, nativeEvent);

  Object.defineProperty(clonedEvent, 'target', {
    writable: true,
    value: { value: newValue, name },
  });
  onChange(clonedEvent, child);
}

Ideal solution

This should be implemented in Base UI

@siriwatknp siriwatknp added component: select This is the name of the generic UI component, not the React module! package: base-ui Specific to @mui/base package: joy-ui Specific to @mui/joy enhancement This is not a bug, nor a new feature labels May 1, 2023
@sai6855
Copy link
Contributor

sai6855 commented May 2, 2023

Is this issue duplicate of #36946 and mui/base-ui#14 ?

@siriwatknp
Copy link
Member Author

Is this issue duplicate of #36946 and mui/base-ui#14 ?

You are right! I'm closing this.

@siriwatknp siriwatknp added the duplicate This issue or pull request already exists label May 2, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
component: select This is the name of the generic UI component, not the React module! duplicate This issue or pull request already exists enhancement This is not a bug, nor a new feature package: base-ui Specific to @mui/base package: joy-ui Specific to @mui/joy
Projects
None yet
Development

No branches or pull requests

2 participants