I haven't been able to find anything relating to an action to submit an update request when we click away. Something like wire:clickaway = "update( {{ example -> id }} )"
Essentially, I am trying to create the effect of when a user clicks on the title, it will open an input box. Than when user clicks away, it will save the data that has been updated in the box.
Right now, I got this working with a checkmark icon appearing when the edit is true using Alpine
<div x-data="{edit : false}" >
<h2 @click="edit = true" x-show="edit === false" >{{$example -> title}} </h2>
<div x-show="edit === true">
<input name="title" type="text" placeholder="{{$example -> title}}" wire:model="title" >
<i class="bi bi-check " wire:click="update({{ $example->id }})" @click="edit = false"></i>
</div>
</div>
I wanted to change this to something like
<div x-data="{edit : false}" >
<h2 @click="edit = true" x-show="edit === false" >{{$example -> title}} </h2>
<input x-show="edit === true" name="title" type="text" placeholder="{{$example -> title}}" wire:model="title" wire:clickaway="update({{ $example->id }})" @click.away="edit = false" >
</div>
Is there a way to pass the submit of update({{ $example->id }}) using the Alpine JS @click.away?
The answer is what @Dirk Jan said
wire:change="update({{ example -> id }})"