# resetDefaultValues

> Update the baseline default values after async operations like form submission, preserving in-flight user edits and recomputing dirty state in React Hook Form.

Source: https://react-hook-form.com/docs/useform/resetdefaultvalues

## `resetDefaultValues:` [UseFormResetDefaultValues](https://react-hook-form.com/ts#UseFormResetDefaultValues) _(since v7.77.0)_

Update `defaultValues` and recompute `dirtyFields`/`isDirty` against the new baseline without modifying the current form values. This is useful when a form disables submission while `!isDirty` — after a successful async submission you can advance the baseline to the submitted values so that only post-submit edits are considered dirty.

### Props

---

| Name      |               | Type                         | Description                                                                                                          |
| --------- | ------------- | ---------------------------- | -------------------------------------------------------------------------------------------------------------------- |
| `values`  |               | `object`  | The new default values to establish as the baseline. Recommended to provide the full object.                         |
| `options` | `keepDirty`   | `boolean` | When set to `true`, existing `dirtyFields` state is preserved as-is rather than recomputed against the new baseline. |
|           | `keepIsValid` | `boolean` | When set to `true`, validation is not re-run after the baseline update and `isValid` remains unchanged.              |

> **Important: Rules**
>
> - Current form values (what the user has typed) are **never** modified by this method — only the internal baseline used to compute dirty state changes.
> - `dirtyFields` and `isDirty` are recomputed against the new baseline unless `keepDirty` is set.
>

### Examples

---

**After Async Submission**

**TS**

```tsx
import { useForm } from "react-hook-form"

interface FormValues {
  firstName: string
  lastName: string
}

export default function App() {
  const {
    register,
    handleSubmit,
    resetDefaultValues,
    formState: { isDirty },
  } = useForm<FormValues>({
    defaultValues: { firstName: "", lastName: "" },
  })

  const onSubmit = async (data: FormValues) => {
    await saveToServer(data)
    // Advance the baseline to the submitted values.
    // isDirty will now only be true if the user edits after this point.
    resetDefaultValues(data)
  }

  return (
    <form onSubmit={handleSubmit(onSubmit)}>
      <input {...register("firstName")} />
      <input {...register("lastName")} />
      <button type="submit" disabled={!isDirty}>
        Save
      </button>
    </form>
  )
}
```

**JS**

```javascript
import { useForm } from "react-hook-form"

export default function App() {
  const {
    register,
    handleSubmit,
    resetDefaultValues,
    formState: { isDirty },
  } = useForm({
    defaultValues: { firstName: "", lastName: "" },
  })

  const onSubmit = async (data) => {
    await saveToServer(data)
    // Advance the baseline to the submitted values.
    // isDirty will now only be true if the user edits after this point.
    resetDefaultValues(data)
  }

  return (
    <form onSubmit={handleSubmit(onSubmit)}>
      <input {...register("firstName")} />
      <input {...register("lastName")} />
      <button type="submit" disabled={!isDirty}>
        Save
      </button>
    </form>
  )
}
```

**With Options**

```javascript
import { useForm } from "react-hook-form"

export default function App() {
  const { register, resetDefaultValues } = useForm({
    defaultValues: { firstName: "", lastName: "" },
  })

  const handleServerUpdate = (serverValues) => {
    resetDefaultValues(serverValues, {
      keepDirty: true, // preserve existing dirty tracking
      keepIsValid: true, // skip re-validation
    })
  }

  return (
    <form>
      <input {...register("firstName")} />
      <input {...register("lastName")} />
      <button
        type="button"
        onClick={() =>
          handleServerUpdate({ firstName: "Jane", lastName: "Doe" })
        }
      >
        Load server values
      </button>
    </form>
  )
}
```

### Tips

---

- Use `resetDefaultValues` for an autosave form. After each save, move the baseline to the saved values, so `isDirty` shows only the changes that have not been saved yet. The user can keep typing, and the inputs are not touched.
- Pass the values that were actually saved, for example the server response, and not the current form values. If the user typed while the request was in flight, those changes then stay dirty.
- To also clear errors, touched fields, and submission state, use [`reset`](https://react-hook-form.com/docs/useform/reset) instead.

### Troubleshooting

---

#### The inputs do not change after `resetDefaultValues`

**Why it happens:**

This method changes only the baseline used for dirty comparison. It deliberately preserves the current values so edits made while a save request is in flight are not lost.

**Fix:**

Use [`reset(values)`](https://react-hook-form.com/docs/useform/reset) when you want to replace both the current values and the default values. Use `resetDefaultValues(values)` only when the inputs should stay untouched.

#### `isDirty` is still `true` after a successful save

**Why it happens:**

The current values differ from the new baseline. This commonly happens when the user types while the request is in flight, or when only part of the saved object is passed to `resetDefaultValues`.

**Fix:**

Pass the complete values that the server actually saved. If the user made newer edits during the request, leave `isDirty` as `true`—those edits have not been saved yet.

### Related

---

- [reset](https://react-hook-form.com/docs/useform/reset)
- [resetField](https://react-hook-form.com/docs/useform/resetfield)