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

issue: Example NumberField component can't get subsequently updated by the reset function if field is empty #92

Open
ingadi opened this issue Mar 17, 2023 · 2 comments

Comments

@ingadi
Copy link
Contributor

ingadi commented Mar 17, 2023

Version Number

1.4.5

Codesandbox/Expo snack

https://codesandbox.io/s/cocky-driscoll-0bpr67?file=/src/App.tsx

Steps to reproduce

  1. Go to provided code sandbox
  2. Click 'Reset to defaults' (works -> both fields get updated to their default values)
  3. Empty both fields
  4. Click 'Reset to defaults' (only the text field gets updated to it's default value )

Expected behaviour

Number fields should keep getting updated beyond the first call to reset.

Relevant log output

No response

@ingadi
Copy link
Contributor Author

ingadi commented Mar 17, 2023

I got it to work by changing the example NumberField component provided in the docs to this (basically just adding a number type to the TextField component:

function NumberField() {
  const {
    field: { value, onChange },
  } = useTsController<number | string>();

  return (
    <div>
      <input
        type="number"
        value={value ?? ""}
        onChange={(e) => {
          const val = e.target.valueAsNumber;
          onChange(isNaN(val) ? "" : val);
        }}
      />
    </div>
  );
}

@ingadi ingadi changed the title issue: Number fields no longer get updated beyond the first update using the reset function issue: Example NumberField component doesn't update after a first update using the reset function Mar 17, 2023
@ingadi ingadi changed the title issue: Example NumberField component doesn't update after a first update using the reset function issue: Example NumberField component doesn't update after an initial update by the reset function Mar 17, 2023
@ingadi ingadi changed the title issue: Example NumberField component doesn't update after an initial update by the reset function issue: Example NumberField component can't get updated by the reset function if empty Mar 17, 2023
@ingadi ingadi changed the title issue: Example NumberField component can't get updated by the reset function if empty issue: Example NumberField component can't get updated by the reset function if field is empty Mar 17, 2023
@ingadi ingadi changed the title issue: Example NumberField component can't get updated by the reset function if field is empty issue: Example NumberField component can't get subsequently updated by the reset function if field is empty Mar 17, 2023
@iway1
Copy link
Owner

iway1 commented Mar 17, 2023

thanks for the repro, seems like the issue only happens when resetting from an empty field which is interesting.

The difference with your above fix is that it's setting the form state to a string value, which is different from what the example number field does (it sets to a number instead of a string), which isn't going to validate correctly I don't think.

I think I know what's causing this though

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants