Question

我正在PHP LARAVEL中工作，我想要的是一个敬酒者，用于从数据库中删除项目。因此，单击按钮删除时，烤面包机应询问“您确定要删除吗？”在ajax中。如果选择“确定”，则应删除数据，如果选择“取消”，则不应删除数据。如何做到这一点？

下面是我的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>

有人可以帮我吗？

Answer 1

您可以使用引导程序的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();

                }

            });
        });
    });

Answer 2

<!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*/
  }

    });

Answer 3

您可以为此目的使用sweetalert。

Sweet alert docs

添加此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>

删除前如何在烤面包机中要求确认

3 个答案: