[英]Delete category with Sweet-alert message and Laravel 5.2
I have Categories and sub categories listed in my view.我的视图中列出了类别和子类别。 I also have a delete category button, which does work, and deletes the category and all of its sub cateories.
我还有一个删除类别按钮,它可以工作,并删除类别及其所有子类别。 What I want to do is before deleting a Parent category, I want the sweet alert button to pop up and ask if your sure you want to delete this category, with a yes and no button?
我想要做的是在删除父类别之前,我希望弹出甜蜜警报按钮并询问您是否确定要删除此类别,带有是和否按钮? I know I have to use ajax probably to accomplish does, but Im Not so great with ajax.
我知道我可能必须使用 ajax 来完成,但我对 ajax 不太好。 Right now this is what I have, and when I click the delete button it deletes the categories, but the sweet alert message doesn't show up.
现在这就是我所拥有的,当我单击删除按钮时,它会删除类别,但没有显示甜蜜的警报消息。
Route.php路由.php
/** Delete a category **/
Route::delete('admin/categories/delete/{id}', [
'uses' => '\App\Http\Controllers\CategoriesController@deleteCategories',
'as' => 'admin.category.delete',
'middleware' => ['auth'],
]);
CategoriesController.php: CategoriesController.php:
class CategoriesController extends Controller {
/** More function here, just hidden for ease right now **/
/**
* Delete a Category
*
* @param $id
* @return \Illuminate\Http\RedirectResponse
*/
public function deleteCategories($id) {
// Find the category id and delete it from DB.
Category::findOrFail($id)->delete();
// Then redirect back.
return redirect()->back();
}
}
My form:我的表格:
@foreach ($categories as $category)
{{ $category->category }}
<form method="post" action="{{ route('admin.category.delete', $category->id) }}" class="delete_form">
{{ csrf_field() }}
<input type="hidden" name="_method" value="DELETE">
<button id="delete-btn">
<i class="material-icons delete-white">delete_forever</i>
</button>
</form>
@endforeach
And My sweet alert call:还有我甜蜜的警报电话:
<script type="text/javascript">
$('#delete-btn').on('click', function(e){
e.preventDefault();
var self = $(this);
swal({
title: "Are you sure?",
text: "All of the sub categories will be deleted also!",
type: "warning",
showCancelButton: true,
confirmButtonColor: "#DD6B55",
confirmButtonText: "Yes, delete it!",
closeOnConfirm: true
},
function(isConfirm){
if(isConfirm){
swal("Deleted!","Category and all sub categories deleted", "success");
setTimeout(function() {
self.parents(".delete_form").submit();
}, 2000);
}
else{
swal("cancelled","Your categories are safe", "error");
}
});
});
</script>
Got it working, I had to do this for my sweet alert JavaScript:让它工作,我必须为我的甜蜜警报 JavaScript 这样做:
$(document).on('click', '#delete-btn', function(e) {
e.preventDefault();
var self = $(this);
swal({
title: "Are you sure?",
text: "All of the sub categories will be deleted also!",
type: "warning",
showCancelButton: true,
confirmButtonColor: "#DD6B55",
confirmButtonText: "Yes, delete it!",
closeOnConfirm: true
},
function(isConfirm){
if(isConfirm){
swal("Deleted!","Category and all sub categories deleted", "success");
setTimeout(function() {
self.parents(".delete_form").submit();
}, 1000);
}
else{
swal("cancelled","Your categories are safe", "error");
}
});
});
Thanks to maximl337 for the help!感谢 maximl337 的帮助!
Bind the click event to DOM instead of the element.将点击事件绑定到 DOM 而不是元素。
$(document).on('click', '#delete-btn', function(e) { ... });
This also resolves issues with dynamically loaded elements, for eg: rendering action buttons after an ajax call.这也解决了动态加载元素的问题,例如:在 ajax 调用后呈现操作按钮。
在 DOM 节点上使用 submit 事件而不是 jquery 对象:
$('.delete_form')[0].submit();
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.