刪除前如何在toastr中要求確認
[英]How to ask for confirmation in toastr before deletion
問題描述
我在 PHP LARAVEL 工作，我想要的是一個 toastr 從數據庫中刪除一個項目。 所以當按鈕被點擊刪除時，toastr 應該會問“你確定要刪除嗎？” 在阿賈克斯。 如果選擇“確定”，則數據應被刪除，如果選擇“取消”，則數據不應被刪除。 如何做到這一點？
下面是我的ajax代碼：
//to unfollow feed
$('#following').click(function (e) {
e.preventDefault();
var formData = $("#unfollowFeed").serialize();
$('.error-msg').html('');
$.ajax({
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
url: baseUrl + 'unfollow',
type: 'POST',
data: formData,
success: function (data) {
var id=$('#feed_id').val();
$("#feedId li[feed-id=" + id + "]").remove(); //to remove <li> of removed feed from sidebar.
toastr.error('The feed was removed.');
$('#follow').show();
$('#following').hide();
}
});
});
這是我的觀點部分：
<a href style="{{ $status == 0 ? 'display:none;' : '' }}" class=" btn btn-sm btn-primary following" id="following" >{{ __('Following') }}</a>
誰能幫我這個？
3 個解決方案
解決方案1
1 2019-12-30 08:36:07
您可以使用 bootstrap 的Sweetalert
$('#following').click(function (e) {
e.preventDefault();
var formData = $("#unfollowFeed").serialize();
$('.error-msg').html('');
swal({
title: "Are you sure?",
text: "You will not be able to recover this imaginary file!",
type: "warning",
showCancelButton: true,
confirmButtonColor: "#DD6B55",
confirmButtonText: "Yes, delete it!",
closeOnConfirm: false
}, function() {
$.ajax({
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
url: baseUrl + 'unfollow',
type: 'POST',
data: formData,
success: function (data) {
var id=$('#feed_id').val();
$("#feedId li[feed-id=" + id + "]").remove(); //to remove <li> of removed feed from sidebar.
toastr.error('The feed was removed.');
$('#follow').show();
$('#following').hide();
}
});
});
});
解決方案2
0 已采納 2019-12-30 08:34:45
<!DOCTYPE html> <html> <body> <p>Example: Click the button to display a confirm box.</p> <button onclick="myFunction()">Try it</button> <p id="demo"></p> <script> function myFunction() { var txt; var r = confirm("Press a button!"); if (r == true) { txt = "You pressed OK!"; } else { txt = "You pressed Cancel!"; } document.getElementById("demo").innerHTML = txt; } </script> </body> </html>
您可以使用內置的確認框：
$('#following').click(function (e) {
var response = confirm("Are you sure to delete?");
if (response == true) {
e.preventDefault();
var formData = $("#unfollowFeed").serialize();
$('.error-msg').html('');
$.ajax({
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
url: baseUrl + 'unfollow',
type: 'POST',
data: formData,
success: function (data) {
var id=$('#feed_id').val();
$("#feedId li[feed-id=" + id + "]").remove(); //to remove <li> of removed feed from sidebar.
toastr.error('The feed was removed.');
$('#follow').show();
$('#following').hide();
}
});
} else {
/* do anything on Pressed cancel*/
}
});
解決方案3
0 2019-12-30 08:38:18
為此，您可以使用 sweetalert。
添加這個cdn <script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
然后
<script>
$('#following').click(function (e) {
e.preventDefault();
swal({
title: "Are you sure?",
text: "Once deleted, you will not be able to recover this imaginary
file!",
icon: "warning",
buttons: true,
dangerMode: true,
})
.then((willDelete) => {
if (willDelete) {
ajaxcall(); //calling ajax function
swal("Poof! Your imaginary file has been deleted!", {
icon: "success",
});
} else {
swal("Your imaginary file is safe!");
}
});
});
function ajaxcall()
{
$('.error-msg').html('');
$.ajax({
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
url: baseUrl + 'unfollow',
type: 'POST',
data: formData,
success: function (data) {
var id=$('#feed_id').val();
$("#feedId li[feed-id=" + id + "]").remove(); //to remove <li> of removed feed from sidebar.
toastr.error('The feed was removed.');
$('#follow').show();
$('#following').hide();
}
});
}
</script>
在使用Bootstrap 3選項卡更改選項卡之前，我如何要求確認？
[英]How do I ask for confirmation before changing tabs using Bootstrap 3 tabs?
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.