# onEnter

> `onEnter` runs an action when the Enter key is pressed while an element is focused — the keyboard peer of `onClick`. There is no form to submit: in Osy# a field writes straight into your state (or an entity, as you type), so "pressing Enter" just runs the action that commits, exactly like clicking the button would.

<!-- id: ui-on-enter · area: ui · stability: stable · html: https://osysharp.com/reference/ui/on-enter/ -->

## Summary        {#summary}
`onEnter` binds an **action** to the Enter key, so a keyboard user can submit a field without reaching for the
mouse:

```osy syntax
component SignInCard() {
  string email = "";
  string password = "";
  action SignIn() { Session.SignIn(Login(email, password)); }
  render {
    Stack(gap: 3) {
      Input(value: email,    onEnter: SignIn);
      Input(value: password, type: "password", onEnter: SignIn);
      Pressable(onClick: SignIn) { Text("Sign in"); }
    }
  }
}
```

Enter in either field runs `SignIn`, just as clicking the button does.

That fragment shows only the binding. **A working sign-in also needs** the `Login` function marked `[AuthMethod]`
(so a signed-out visitor may call it at all) and wired into `app.AuthBootstrap` — the compiler enforces that pairing
both ways. [[AuthMethod] — a function an unauthenticated visitor may call](https://osysharp.com/reference/security/auth-method/) carries the whole thing as one compiled example.

## Signature      {#signature}
```osy syntax
Input(value: email, onEnter: SignIn) — run an action when Enter is pressed in the field
```

## Description    {#description}

### There is no form to post   {#no-form}
In the web platform a `<form>` serializes its fields and POSTs them to a URL, and pressing Enter is what triggers
that POST. **Osy# has no such POST.** A bound `Input` writes its value straight into your component's state — or,
for an entity field, into the row through the page's edit session **as you type** — so by the time you press Enter
there is nothing to submit: the data is already there. "Submitting" is just **running an action** that commits it.

So `onEnter` is not a form-submit affordance dressed up. It is the **keyboard peer of `onClick`**: both run an
action, one on click, one on the Enter key. Reach for it wherever pressing Enter should do the same thing a button
would — a login, a search box, an inline "add row" field.

### What `onEnter` takes — an action, not a submit   {#action}
`onEnter` takes an action, exactly like the other event props (`onClick`/`onInput`/`onChange`/`onBlur`). It can be
a bare action name or one bound with arguments:

```osy title="a bare action, and one bound with arguments" test app=ui-on-enter
[Principal] entity Person { [Required] string Email; }

entity Note {
  [Required] string Title;
  security { allow create, read, update when IsAuthenticated; }
}

[Page("/notes")] [Render(CSR)]
component NoteSearch() {
  string query = "";
  string draft = "";
  var hits = Note.Where(n => n.Title == query).ToList();

  action Search() { /* the query is already in state — this is where you act on it */ }
  action AddItem(string title) { var n = new Note { Title = title }; draft = ""; }

  render {
    Stack(gap: 3) {
      Input(value: query, onEnter: Search);               // a bare action name
      Input(value: draft, onEnter: () => AddItem(draft)); // bound with an argument
      foreach (var h in hits) { Text(h.Title); }
    }
  }
}
```

Enter while the field is empty still fires — the action decides what to do (a login action with a blank password
just fails and leaves you on the page).

### Can `onEnter` go on something other than an `Input`?   {#any-element}
`onEnter` is a general event prop, not an `Input`-only one. Put it on any focusable atom where Enter should act —
an `Input`, a `Pressable`, a search box built from a `Box`. A key that is not Enter does nothing, and an Enter that
is confirming an IME candidate (composing CJK text, say) is ignored, so it never submits the half-typed word.

## See also   {#see-also}
- [creating & saving data](https://osysharp.com/reference/ui/data-mutation/) — how a bound field writes state / an entity as you type (the reason there's nothing to post).
- [The reactivity & lifecycle model](https://osysharp.com/reference/ui/reactivity/) — `on change` and the once-only lifecycle bodies, for reactions that aren't triggered by a key.