---
name: "up:form:submit"
area: "API"
kind: "DOM event"
parent: "up.form module"
url: "https://unpoly.com/api/up:form:submit"
---
<nav aria-label="Unpoly docs">[All docs](https://unpoly.com/index.md) · [up.form module](https://unpoly.com/api/up.form.md)</nav>

# up:form:submit

This event is [emitted](https://unpoly.com/api/up.emit.md) when a form is [submitted](https://unpoly.com/api/up.submit.md) through Unpoly.

When the form is being [validated](https://unpoly.com/api/up-validate.md), this event is not emitted. Instead, an [`up:form:validate`](https://unpoly.com/api/up:form:validate.md) event is emitted.

<nav aria-label="Guides">

- [Learn: Submitting forms](https://unpoly.com/learn/submitting-forms.md)

</nav>

## Changing render options {#changing-render-options}

Listeners may inspect and manipulate [render options](https://unpoly.com/api/up.render.md#parameters) for the coming fragment update.

The code below will use a custom [transition](https://unpoly.com/api/up-transition.md) when a form submission [fails](https://unpoly.com/learn/error-responses.md):

```js
up.on('up:form:submit', function(event) {
  event.renderOptions.failTransition = 'shake'
})
```

---

## Event properties {#properties}

### Submission {#properties-submission}

#### event.form {#event.form}

(required)

The form that is being submitted.

Type: [Element](https://developer.mozilla.org/en-US/docs/Web/API/Element)

#### event.params {#event.params}

(required)

The [form parameters](https://unpoly.com/api/up.Params.md) that will be sent as the form's request payload.

Listeners may inspect and modify params before they are sent.

Type: [up.Params](https://unpoly.com/api/up.Params.md)

#### [event.submitButton] {#event.submitButton}

(optional)

The button used to submit the form.

If no button was pressed directly (e.g., the user pressed `Enter` inside a focused text field), this returns the first submit button.

If the form has no submit buttons, this property is `undefined`.

Type: [Element](https://developer.mozilla.org/en-US/docs/Web/API/Element)

#### event.target {#event.target}

(required)

The element that caused the form submission.

This is usually a submit button or a focused field from which the user pressed `Enter`. If the element is not known, the event is emitted on the `<form>` element.

Type: [Element](https://developer.mozilla.org/en-US/docs/Web/API/Element)

### Render pass {#properties-render-pass}

#### event.renderOptions {#event.renderOptions}

(required)

An object with [render options](https://unpoly.com/api/up.render.md#parameters) for the fragment update.

Listeners may inspect and modify these options.

Type: [Object](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Working_with_Objects)

#### event.preventDefault() {#event.preventDefault}

(required)

Prevents the form from being submitted.