# React | Should onSubmit Go on the <form> or the <button>?

### 1. Using onSubmit on the <form>

- Put `onSubmit` on the `<form>`.
- Use `type="submit"` on the button.
- Call `e.preventDefault()` in your handler if needed.

```jsx
<form onSubmit={handleSubmit}>
  <input type="text" />
  <button type="submit">Send</button>
</form>
```

*This approach handles submission for the entire form, including when the user presses the Enter key, which improves keyboard accessibility.*



### 2. Using onClick on the <button>

- Works, but not ideal for forms.
- Still use type="submit" for accessibility.

```jsx
<form>
 <input type="text" />
 <button type="submit" onClick={handleSubmit}>Send</button>
</form>
```

*This approach only responds to mouse clicks or taps on the button itself, and may not handle keyboard submission (e.g. pressing Enter) properly, which can negatively affect accessibility.*
