I am having trouble displaying a modal when my component initializes. I have tried using $this->emit('show)
to open the modal
When I add a button in my view, the emit('show')
works! However, I want the modal to be automatically shown when the view is loaded
This is the code for my component:
public function mount($id)
{
if ($id != null) {
try {
$data = DetalleRamComputadora::find($id);
$this->fk_ram_tecnologia = $data->fk_tecnologia;
$this->fk_ram_capacidad = $data->fk_capacidad;
$this->fk_ram_frecuencia = $data->frecuencia;
$this->emit('show'); // Open the modal
} catch (\Throwable $th) {
// Handle error
}
}
}
This is the script in my view:
<script type="text/javascript">
window.livewire.on('show', () => {
$('#exampleModal').modal('show');
});
</script>
And here is the markup for my modal:
<div wire:ignore.self class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close" >
<span aria-hidden="true close-btn">×</span>
</button>
</div>
<div class="modal-body">
...
</div>
<div class="modal-footer">
...
</div>
</div>
</div>