---
url: "https://vueda.dev/v3/reference/api/vue/ViewUpdate.md"
title: "ViewUpdate"
---

# ViewUpdate

## Overview

Editable detail view that loads a model instance, presents it in a form, and submits changes
back to the server on save.

Theme entry: [ViewUpdate](/v3/reference/theming/keys/ViewUpdate.md)

## Props

| Name | Type | Required | Default | Description |
| --- | --- | --- | --- | --- |
| <span id="prop-themeOverride">themeOverride</span> | `Object` |  | `null` | A partial ThemeObject keyed by component name, merged over this component's theme and provided to descendants. |
| <span id="prop-app">app</span> | `string` | yes |  | Django app label that owns the model. |
| <span id="prop-model">model</span> | `string` | yes |  | Django model name used to resolve API endpoints and configuration. |
| <span id="prop-pk">pk</span> | `string` | yes |  | Primary key of the object instance to fetch and edit. |
| <span id="prop-submitFields">submitFields</span> | `array` |  | `undefined` | Field paths sent in the update request body, which also carries the primary key. Falls back to the model config's submitFields when omitted or empty. |
| <span id="prop-redirectAfter">redirectAfter</span> | `string` |  | `null` | Named view to redirect to after a successful update; `null` stays on the current page. |
| <span id="prop-class">class</span> | `string\|array\|object` |  | `() => []` | CSS class(es) applied to the outermost root element. |
| <span id="prop-formModelVariant">formModelVariant</span> | `string` |  | `undefined` | Theme variant that the inner FormModel component receives as `variant`. Wins over a `variant` in the model config's `formProps` when passed. |
| <span id="prop-fields">fields</span> | `array` |  | `undefined` | Field names to render in the form; overrides the model config default. |
| <span id="prop-fieldDetails">fieldDetails</span> | `object` |  | `undefined` | Map of field paths to field detail overrides. |
| <span id="prop-expand">expand</span> | `array` |  | `undefined` | Field names to render in expanded (inline) mode. |
| <span id="prop-expandDetails">expandDetails</span> | `object` |  | `undefined` | Map of expand field paths to detail overrides. |
| <span id="prop-fieldComponents">fieldComponents</span> | `object` |  | `undefined` | Map of field paths to async functions returning an override field component. |
| <span id="prop-widgetComponents">widgetComponents</span> | `object` |  | `undefined` | Map of field paths to async functions returning an override widget component. |
| <span id="prop-formProps">formProps</span> | `object` |  | `undefined` | Extra props for the inner FormModel component. They win over the model config's `formProps` and lose to this view's own form props. The `app`, `model`, and `view` keys are ignored, because the view sets them. |
| <span id="prop-fieldProps">fieldProps</span> | `object` |  | `undefined` | Map of field paths to additional props passed to the field component. Replaces a `fieldProps` map in the model config's `formProps` when passed. |
| <span id="prop-widgetProps">widgetProps</span> | `object` |  | `undefined` | Map of field paths to additional props passed to the widget component. Replaces a `widgetProps` map in the model config's `formProps` when passed. |
| <span id="prop-relatedObjectRules">relatedObjectRules</span> | `object` |  | `{}` | Rules mapping related object keys to fetch data alongside the main object. |
| <span id="prop-calculatedObjectRules">calculatedObjectRules</span> | `object` |  | `{}` | Rules mapping calculated object keys to derive computed data alongside the main object. |
| <span id="prop-fetchFields">fetchFields</span> | `array` |  | `undefined` | Field names to request from the API when fetching the object and in the update response; falls back to the model config's fetchFields when omitted or empty. |

## Slots

| Name | Scoped | Description |
| --- | --- | --- |
| `targetless-action-button` | yes |  |
| `extra-buttons` |  | Additional action buttons appended in the page title action area. |
| `submit-button` | yes | Override the submit button shown in the sticky action bar. |
| `action-button` | yes | Override an individual action link button in the sticky bar. |
| `transition-button` | yes | Override an individual workflow transition button in the sticky bar. |
| `record-name` | yes | Override the heading that names the record above the form; receives `recordName` (the fetched object's formatted name, empty when there is none) and `pending` (true while the name is loading). |
| `update-unavailable` | yes | Override the notice shown instead of the form when the object's available_actions does not permit the current action; receives `app`, `model`, `pk`, and `verboseName` (the model config's verbose name, if any). |
| `form-confirm-dialog-warnings` | yes |  |
| `warning-entry` | yes |  |

[Full slot reference](/v3/reference/api/vue/ViewUpdate/slots.md)

## Events

| Name | Description |
| --- | --- |
| `object` |  |
| `loading` |  |
| `related-object` |  |
| `calculated-object` |  |
| `form-object` |  |
| `form-context` |  |

[Full event reference](/v3/reference/api/vue/ViewUpdate/events.md)

## Source

`client/lib/views/ViewUpdate.vue`