Laravel Livewire Click Away to submit

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( )"

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" > </h2>     <div x-show="edit === true">    <input name="title"  type="text" placeholder="" wire:model="title"  >    <i class="bi bi-check "  wire:click="update()" @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" > </h2>     <input x-show="edit === true" name="title"  type="text" placeholder="" wire:model="title" wire:clickaway="update()" @click.away="edit = false" >      </div>  

Is there a way to pass the submit of update() using the Alpine JS @click.away?

https://stackoverflow.com/questions/66740176/laravel-livewire-click-away-to-submit March 22, 2021 at 12:00PM