Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

maaz's avatar
Level 2

Livewire component is not refreshing after delete action?

Hello everyone. i am using livewire to delete a record from the table but table data is not refreshing until i reload it. On the same component when i insert the data table data also updated. here is my code

add-user.blade.php

<div>
    <div>
        <button type="button" class="btn btn-primary float-right mb-2 mr-2" data-toggle="modal"
        data-target="#modals-top">Show </button>
        <div class="table-responsive">
        <table class="table table-hover table-bordered">
            <thead>
              <tr>
                <th>Name</th>
                <th>Email</th>
                <th>Country</th>
                <th>Postal Code</th>
                <th>Date Of Birth</th>
                <th>Actions</th>
              </tr>
            </thead>
            <tbody>
                {{-- {{ dd($users) }} --}}
                @forelse ($users as $user)
                <tr>
                  <td>{{ $user->FullName }}</td>
                  <td>{{ $user->email }}</td>
                  <td>{{ $user->country }}</td>
                  <td>{{ $user->postal_code }}</td>
                  <td>{{ $user->date_of_birth }}</td>
                  <td>
                    @if ($confirming === $user->id)
                        <a wire:click="delete({{ $user->id }})"
                            class="btn btn-danger btn-sm">Sure?</a>
                    @else
                        <a wire:click="confirmDelete({{ $user->id }})"
                            class="btn btn-warning btn-sm">Delete</a>
                    @endif

                </td>
                </tr>
                @empty
                    <td>Data Not Found</td>
                @endforelse

            </tbody>
          </table>
        </div>
    </div>


    {{-- modal --}}
        <div wire:ignore.self class="modal fade show" id="modals-top">
            <div class="modal-dialog modal-lg">
                <form class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title">
                            Add User
                            <span class="font-weight-light">Information</span>
                            <br>
                        </h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">×</button>
                    </div>
                    <div class="modal-body">
                        <div class="form-row">
                            <div class="form-group col mb-0">
                                <label class="form-label">First Name</label>
                                <input type="text" wire:model="first_name" class="form-control"
                                    placeholder="First name">
                                    @error('first_name') <span class="error">{{ $message }}</span> @enderror
                            </div>
                            <div class="form-group col mb-0">
                                <label class="form-label">Last Name</label>
                                <input type="text" wire:model="last_name" class="form-control" placeholder="Last name">
                                @error('last_name') <span class="error">{{ $message }}</span> @enderror
                            </div>
                        </div><br>

                        <div class="form-row">
                            <div class="form-group col mb-0">
                                <label class="form-label">Email</label>
                                <input type="text" wire:model="email" class="form-control" placeholder="First name">
                                @error('email') <span class="error">{{ $message }}</span> @enderror
                            </div>
                            <div class="form-group col mb-0">
                                <label class="form-label">Country</label>
                                <select wire:model="country" class="form-control">
                                    <option value="pak">Pak</option>
                                    <option value="us">US</option>
                                    <option value="uk">UK</option>
                                </select>
                                @error('country') <span class="error">{{ $message }}</span> @enderror
                            </div>

                        </div><br>



                        <div class="form-row">
                            <div class="form-group col mb-0">
                                <label class="form-label">Password</label>
                                <input type="password" wire:model="password" class="form-control"
                                    placeholder="enter password">
                                    @error('password') <span class="error">{{ $message }}</span> @enderror
                            </div>

                            <div class="form-group col mb-0">
                                <label class="form-label">Confirm Password</label>
                                <input type="password" class="form-control" wire:model="password_confirmation"
                                    placeholder="confirm your password">
                                    @error('password_confirmation') <span class="error">{{ $message }}</span> @enderror
                            </div>
                        </div><br>

                        <div class="form-row">
                            <div class="form-group col mb-0">
                                <label for="" class="form-label">
                                    Postal Code
                                </label>
                                <input type="text" wire:model="postal_code" class="form-control"
                                    placeholder="postal code">
                                    @error('postal_code') <span class="error">{{ $message }}</span> @enderror
                            </div>
                            <div class="form-group col mb-0">
                                <label for="" class="form-label">
                                    Date Of Birth
                                </label>
                                <input type="date" wire:model="date_of_birth" class="form-control"
                                    >
                                    @error('date_of_birth') <span class="error">{{ $message }}</span> @enderror
                            </div>
                        </div>

                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                        <button type="button" wire:click.prevent="save" class="btn btn-primary">Save</button>
                    </div>
                </form>
            </div>
        </div>
</div>

AddUser.php

 public $users, $first_name,$last_name,$email,$password,$password_confirmation,$country,$postal_code,$date_of_birth;
    public $confirming;
    public $updateMode = false;
    public function __construct()
    {
        $this->users = User::latest()->get();
    }

    // insert data
    public function save()
    {
        $data = $this->validate([
            'first_name' => 'required',
            'last_name' => 'required',
            'email' => 'required|email|unique:users',
            'password' => 'required|min:8',
            'password_confirmation' => 'required|same:password',
            'country' => 'required',
            'postal_code' => 'required',
            'date_of_birth' => 'required',
        ]);

        User::create($data);
        $this->reset();
        $this->dispatchBrowserEvent('closeModal'); // Close model
        $this->dispatchBrowserEvent('alert',['message' => 'User added successfully !!']);
        // $this->emit('reviewSectionRefresh');
    }

	//confirm delete
    public function confirmDelete($id)
    {
        $this->confirming = $id;
    }

    public function delete($id)
    {
        User::findOrFail($id)->delete();
        $this->dispatchBrowserEvent('error',['message' => 'User deleted successfully !!']);

    }
    public function render()
    {
        return view('livewire.admin.user.add-user');
    }
}
0 likes
4 replies
CorvS's avatar

@maaz You are deleting the user like that

User::findOrFail($id)->delete();

so you are not making any changes to your $users collection. What do you expect?

Snapey's avatar

Either remove the user from the local $user collection, or move your database query into the render method, passing users to the view and remove it from the public properties.

also, you should use mount() in your component not the __constructor()

chaudigv's avatar

@maaz Rename __construct() to mount().

After deleting a user. Do this

$this->mount();
$this->render();
2 likes
segunsmart's avatar

What happened is that, after deleting the user you didn't update the users list before rendering.

First remove the construct method, then in your render method, have something like this

public function render()
    {
        $users = User::latest()->get();
        return view('livewire.admin.user.add-user', ['users' => $users]);
    }
1 like

Please or to participate in this conversation.