Skip to content

wire:dirty

Laravel Livewire Documentation Reference

Since Magewire is heavily inspired by Laravel Livewire, many concepts are either identical or very similar. To avoid duplicating documentation, this page only covers Magewire-specific and platform-specific details. For all general concepts and in-depth explanations, you can refer to the corresponding Laravel Livewire documentation.

Livewire Reference

wire:dirty reacts when the component's browser-side value differs from the last server-confirmed value. It is useful for unsaved-change labels and field styling.

<input type="text" wire:model="displayName" wire:dirty.class="field-changed">

<span wire:dirty wire:target="displayName">
    <?= $escaper->escapeHtml(__('Unsaved changes')) ?>
</span>

When placed on an element with wire:model, the directive watches that property automatically. Use wire:target to watch one or more named properties from another element. Magewire clears the dirty state after the server response is merged.

Dirty state is only a UI comparison. It does not replace server-side validation, persistence checks, or protection against concurrent changes.