I'm using datatables and bootstrap's modal. In the datatables buttons, I added one extra button to add a new user, as this buttons are out of the livewire element, I added this script to the button:

$("body").on("click", "#agregar", function() { $("#createDataModal").modal("show"); Livewire.emit("openCreateModal");

This open the modal showing the form and runs the function openCreateModal in my livewire component.

When I click on save on my modal, it runs the function guardar() in my livewire component, but then the modal was not closing automatically, so I added a dispatchBrowserEvent in order to get the confirmation and run the script in my view to get the modal closed, but now I'm not getting the session variable 'sucess' updating, it's always showing as null, therefore, my sucess div in my view is never shown.... any ideas on how to handle this?

This is my livewire component:

public function guardar()
{
    $validatedData = $this->validate([
        'name' => ['required', 'max:50'],
        'email' => ['required', 'email', 'max:50', Rule::unique('users', 'email')],
        'phone' => 'required|numeric|digits:8',
        'password' => ['required', 'min:5', 'max:20', 'confirmed'],
    ]);

    $validatedData['password'] = bcrypt($validatedData['password']);

    $user = User::create($validatedData);

    $successMessage = 'El nuevo usuario se ha creado exitosamente.';
    session()->flash('success', $successMessage );
    $this->dispatchBrowserEvent('guardado', ['success' => $successMessage]);
}

protected $listeners = ['openCreateModal'];

public function openCreateModal()
{
    $this->resetValidation();
    $this->reset();
}

public function render()
{
    $dataTable = (new UsersDataTable)->html();
    return view('livewire.users', compact('dataTable'));
}

This is my view: https://paste.laravel.io/a8019886-6ce8-44b8-9f05-12c059501e8e

Thanks in advance!!!!