Livewire Modal Delete Not Closing
I have this working as far as it is deleting but won't close after delete.
<a href="#" wire:click="deleteCategory({{$category->id}})" data-toggle="modal" data-target="#deleteModal-{{$category->id}}"><i class="fa fa-trash fw-bold text-danger"></i></a>
<!--Delete Modal -->
<div wire:ignore.self class="modal fade" id="deleteModal-{{$category->id}}" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Delete Category</h5>
<button type="button" class="btn-close" data-dismiss="modal" aria-label="Close"></button>
</div>
<form wire:submit.prevent="destroyCategory">
<div class="modal-body">
<h6>Are You Sure You Want To Delete This Category?</h6>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="submit" class="btn btn-primary">Delete</button>
</div>
</form>
</div>
</div>
</div>
<script>
window.addEventListener('close-modal', event => {
$('#deleteModal').modal('hide');
});
</script>
Index.php
public $category_id;
public function deleteCategory($category_id)
{
$this->category_id = $category_id;
}
public function destroyCategory()
{
$category = Category::find($this->category_id);
$path = 'backend/uploads/categories/'.$category->image;
if(File::exists($path)){
File::delete($path) ;
}
$category->delete();
toastr('success','Category Deleted Successfully');
$this->dispatch('close-modal');
}
public function render()
{
$categories = Category::orderBy('id','DESC')->paginate(10);
return view('livewire.admin.category.index',['categories'=>$categories]);
}
Are you saying even when clicking button the modal doesn't hide?
Otherwise make a close modal function that's auto called.
I use:
function closeModal() {
document.getElementById("myModal").style.display = "none";
}
Can be used from a click event or just called as a function.
Please or to participate in this conversation.