codingwithrk's avatar

wire:click is not responding in dataTable

I have having user component in Livewire.

In the blade file, it contains dataTable if I want to change the user status, like wire:click="changeStatus('{{ $user->id}}')" the is is Uuid, this method is not responding.

public function changeStatus($id) { dd($id); }

Nothing happening!

0 likes
14 replies
vincent15000's avatar

@codingwithrk It's also possible that there are some conflicts between Livewire and the JS code for the datatable.

Why don't you code your own datatable with Livewire ? It's very simple to do.

jaseofspades88's avatar

It's difficult to fix your problem without seeing some code. My first guess is you're either...

  1. Not initiating Livewire correctly
  2. Not containing your component in one root html tag

But this is just a guess... literally a guess...

1 like
vincent15000's avatar

@codingwithrk You could improve this part of the code, but it's doesn't concern your problem.

@if($value->status == 1)
	<button type="button" class="btn btn-outline-success btn-sm" wire:click="changeStatus('{{ $value->id }}')">
		<i class="bx bx-check-circle me-0"></i>
	</button>
@elseif($value->status == 0)
	<button type="button" class="btn btn-outline-danger btn-sm" wire:click="changeStatus('{{ $value->id }}')">
		<i class="bx bx-x-circle me-0"></i>
	</button>
@endif

<button type="button" class="btn btn-outline-danger btn-sm" wire:click="changeStatus('{{ $value->id }}')">
	<i @class([
		'bx me-0',
		'bx-x-circle' => $value->status == 0,
		'bx-check-circle' => $value->status == 1
])></i>
</button>
1 like
vincent15000's avatar

@codingwithrk Are you using Livewire v2 ou v3 ?

With Livewire v3, you don't have to specify @livewireStyles inside the <head> tags. Same remark for AlpineJS : with Livewire v3, AlpineJS is directly included with Livewire, so you don't need to declare it in the app.js file, and you must not declare it, otherwise you will have conflicts.

Snapey's avatar

Livewire will automatically inject livewire css and livewire.js and alpine.js

You should remove any references to these from your code.

2 likes

Please or to participate in this conversation.