Loading attributes affect on all buttons

#1

Hi, I have a list of buttons:
<button wire:delete-confirmation="deleteMenuItem({{ $item->id }})" wire:loading.attr="disabled">
When one button is clicked, all the other buttons are also disabled. I’ve tried adding wire:target=deleteMenuItem({{ $item->id }}) but it didn’t work.

#2

Try to attach IDs to you Livewire component in your blade @livewire directive.

#3

still doesn’t work, all the buttons are inside one directive, where should I put the id? :sweat_smile:

#4

Ah, ok. Sorry. Actually ‘loading’ state is valid for whole component (and all elements on it), not for one element. The only thing I can think of is breakdown your component into one main and sub components with delete buttons. Then it should work.

1 Like
#5

Thank you, sub component works for me :smiling_face_with_three_hearts:
One more question, How can I reload the parent component?

#6

Actually I have a question! How this bit is working?

I cannot find anything like this in documentation!

#7

I’m using a custom directive, something like this: https://github.com/livewire/sortable/blob/master/src/index.js

1 Like
#8

Thanks! Very interesting!