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

# up:fragment:aborted

This event is emitted when requests for an element were [aborted](https://unpoly.com/learn/aborting-requests.md).

This event is emitted on the element for which requests were aborted. If requests for an entire layer were aborted, this event is emitted on the [layer's outmost element](https://unpoly.com/api/up.Layer.prototype.element.md).

<nav aria-label="Guides">

- [Learn: Aborting requests](https://unpoly.com/learn/aborting-requests.md)

</nav>

## Example {#example}

This would run code when an element or its descendants were aborted:

```js
up.on(element, 'up:fragment:aborted', function(event) {
  // element or its descendants were aborted
})
```

A more common use case is to run code when an element _or one of its ancestors_ were aborted:

```js
// Listen to all up:fragment:aborted events in case an ancestor
let off = up.on('up:fragment:aborted', function(event) {
   if (up.fragment.contains(event.target, element)) {
      // element or an ancestor in the same layer was aborted
   }
})
// Because we're registering a global event listener, we should
// clean up when `element` is destroyed.
up.destructor(element, off)
```

To simplify observing an element and its ancestors for aborted requests, the function [`up.fragment.onAborted()`](https://unpoly.com/api/up.fragment.onAborted.md) is provided. This allows us to shorten the above code:

```js
// Listen to all up:fragment:aborted events in case an ancestor
up.fragment.onAborted(element, function(event) {
  // element or an ancestor in the same layer was aborted
})
```

---

## Event properties {#properties}

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

(required)

The element for which requests were aborted.

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

### event.reason (Experimental) {#event.reason}

(required)

A string describing the reason for aborting this fragment.

Type: string

### event.newLayer (Experimental) {#event.newLayer}

(required)

Whether the fragment was aborted by a [new overlay opening](https://unpoly.com/learn/opening-overlays.md).

Type: boolean