Sweetalert delete confirm button is not working in laravel 8 - javascript

Hello guys I'M having an issue with my sweetalert delete confirmation. When I click on "Yes Delete it!" nothing happens and there are no errors showing in my console please guys I seriously need help this has kept me on deck for a long time now. I really be grateful if I get quick responses.
This is my blade.php
<button onclick="deleteConfirmation({{$poster->id}})" type="button" class="btn btn-danger delete-confirm offset-md-2">Delete</button>
<script type="text/javascript">
function deleteConfirmation(id) {
swal({
title: "Delete?",
text: "Are you sure you want to delete this?",
type: "warning",
showCancelButton: true,
confirmButtonText: "Yes, delete it!",
cancelButtonText: "No, cancel!",
reverseButtons: true
}).then(function (e) {
if (e.value) {
var CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');
$.ajax({
type: 'DELETE',
url: "{{ url('delete-post') }}" + '/' + id,
data: {_token: CSRF_TOKEN},
dataType: 'JSON',
success: function (results) {
if (results.success === true) {
swal("Done!", results.message, "success");
} else {
swal("Error!", results.message, "error");
}
}
});
} else {
e.dismiss;
}
}, function (dismiss) {
return false;
})
}
</script>
And here is my controller
public function deletepost($id)
{
dd($id);
DB::table('posters')->where('id', $id)->delete();
return back()-> with('post_add', 'Post deleted Successfully');
}
And my route
Route::delete ("/delete-post/{id}", [PosterController::class, "deletepost"])->name("poster.delete");

Related

Execute and Confirm delete using SWAL and ajax on laravel

when i click the button confirm on swal nothing happens, i dont khow if the problem is the ajax code
or somthing else
but when i delete the ajax code from the swal code it works fine and shows the sweetalert so i think the probleme comes from ajax
<script>
function deleteData(id) {
swal({
title: "Suppression",
text: "Veuillez confirmer la suppression",
type: "warning",
showCancelButton: true,
confirmButtonText: "Confirmer",
cancelButtonText: "Annuler",
reverseButtons: true
}.then(function () {
var CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');
$.ajax({
type: "DELETE",
url: "{{url('eventment/type')}}/" + id,
data: {
_token: CSRF_TOKEN
},
dataType: "JSON",
success: function (results) {
if (results.success === true) {
swal("Done!", results.message, "success");
} else {
swal("Error!", results.message, "error");
}
} //success
});
})
) //swal
} //deleteData
</script>
Delete button
<button class="btn btn-danger" onclick="deleteData({{$type->id}})" >Supprimer</button>
route file
Route::delete('eventment/type/{id}','TypeController#destroy')->name('type.destroy');
controller
public function destroy($id)
{
$type = EventType::where('id', $id)->delete();
return redirect()->to(route('admin.type.index'))->withFlashSucces('Le Type A Bien Etait Supprimé');
}
You can do it without ajax.first your button make it as a form
<form id="del_event" action="{{ route('type.destroy',$type->id) }}" method="post"style="display: inline;">
{!! method_field('delete') !!}
{{ csrf_field() }}
<button class="btn btn-danger" type="submit" id="del_id">Supprimer</button>
</form
Button has a id "del_id" when it click call a function below there
<script>
$("#del_id").on('click', function (e) {
e.preventDefault();
swal({
title: "Suppression",
text: "Veuillez confirmer la suppression",
type: "warning",
showCancelButton: true,
confirmButtonText: "Confirmer",
cancelButtonText: "Annuler",
}).then((result) => {
if(result) {
$("#del_event").submit();
}
}
)
;
});
</script>
Your destroy function
$type=EventType::find($id);
$type->delete();``

how to solve the problem with this sweet alert?

I want to integrate sweetalert with my project. but I'm having the following error.
this is my html code
<script type="text/javascript">
$('.bank').on('click', function (e) {
e.preventDefault();
var id = $(this).data('id');
const swalWithBootstrapButtons = Swal.mixin({
customClass: {
confirmButton: 'btn btn-success',
cancelButton: 'btn btn-danger'
},
buttonsStyling: false,
})
swalWithBootstrapButtons.fire({
title: 'Are you sure?',
text: "Payment method Bank Transfer Mandiri!",
type: 'warning',
showCancelButton: true,
confirmButtonText: 'Yes!',
cancelButtonText: 'No, cancel!',
reverseButtons: true
},
function(isConfirm) {
if (isConfirm){
$('#my-form').on('submit', function(e) {
e.preventDefault();
$.ajax({
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
type: "POST",
url: "{{ route('payment') }}",
data: $('#my-form').serialize(),
success: function (data) {
//
}
});
});
}
});
});
</script>
I've been looking for solutions to this problem quite a long time, but I still can not solve it
please help me. thx..
Please include the CDN available for sweatalert.js .
As I don't see any erros above,
I suggest you to add the following code before script .
https://cdnjs.cloudflare.com/ajax/libs/sweetalert/2.1.2/sweetalert.min.js

Show SweetAlert in delete function php

I'm trying to show the sweet alert in my DELETE FEATURE but sadly my code now is not working I already search for similar feature I see some but it not help me thought. Here is my code
<a id="<?php echo $id;?>" value="<?php echo $id;?>" name="delete" onclick="archiveFunction(this.id)">
<i class="glyphicon glyphicon-trash text-red"></i></a>
And this is my ajax request
$(document).ready(function(){
$('[data-toggle="tooltip"]').tooltip();
});
$('#reloadpage').click(function() {
location.reload(true);
});
function archiveFunction(id) {
event.preventDefault(); // prevent form submit
var form = event.target.form; // storing the form
swal({
title: "Are you sure?",
text: "But you will still be able to retrieve this file.",
type: "warning",
showCancelButton: true,
confirmButtonColor: "#DD6B55",
confirmButtonText: "Yes, Delete it!",
cancelButtonText: "No, cancel please!",
closeOnConfirm: false,
closeOnCancel: false
},
function(isConfirm){
if (isConfirm) {
// this is `post` request to the server
// so you can get the data from $_POST variables, says $_POST['delete'] $_POST['v_id']
$.ajax({
method: 'POST',
data: {'delete': true, 'id' : id },
url: 'user_del.php',
success: function(data) {
}
});
swal("Updated!", "Your imaginary file has been Deleted.", "success");
} else {
swal("Cancelled", "Your file is safe :)", "error");
}
And this is my archive query . Don't bother about my query I set the status to 0 for me to archive one data and it will go to archive page. I just want to display the SWEET ALERT when I'm deleting the data or archiving it. Thanks in advance.
<?php session_start();
if(empty($_SESSION['id'])):
header('Location:../index');
endif;
include("../dist/includes/dbcon.php");
$id=$_REQUEST['id'];
$result=mysqli_query($con,"UPDATE accounts_at SET status = 0 WHERE id ='$id'")
or die(mysqli_error());
if ($result !== false) {
echo "<script type='text/javascript'>alert('Successfully deleted a account!');</script>";
echo "<script>document.location='index'</script>";
}
?>
Your UPDATED alert is in the wrong spot if you want it to run after the object is officially deleted on the server.
function(isConfirm){
if (isConfirm) {
// this is `post` request to the server
$.ajax({
method: 'POST',
data: {'delete': true, 'id' : id },
url: 'user_del.php',
success: function(data) {
//if you put it here it will run after the file is deleted
swal("Updated!", "Your imaginary file has been Deleted.", "success");
}
})
//if you put it here it will run before and even if your file is not deleted
// swal("Updated!", "Your imaginary file has been Deleted.", "success");
} else {
swal("Cancelled", "Your file is safe :)", "error");
}
Open up the develop console in your web browser. Does it give you any errors?
Do you get any alerts at all?
try this:
function archiveFunction(id) {
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 (isConfirm) {
if (!isConfirm) return;
$.ajax({
url: "delete.php",
type: "POST",
data: {
id: id
},
dataType: "html",
success: function () {
swal("Done!", "It was succesfully deleted!", "success");
},
error: function (xhr, ajaxOptions, thrownError) {
swal("Error deleting!", "Please try again", "error");
}
});
});
}

How to Delete After Confirmation by Sweet-alert in Laravel...?

I have linked sweetalert plugin for my confirmation message. But it's not getting the confirmation command (onclick yes/confirm button).
This is my delete button:
<a id="demoSwal" href="{{ route('setting.website_type.destroy', ['id' => $websiteType->id]) }}" class="btn btn-light btn-sm btn-delete demoSwal" data-toggle="tooltip" data-placement="top" title="Delete This Type"><i class="far fa-trash-alt"></i></a>
This is My JS Code:
$(document).ready(function(){
$('.demoSwal').click(function(){
swal({
title: "Are you sure?",
text: "You will not be able to recover this file!",
type: "warning",
showCancelButton: true,
confirmButtonText: "Yes, delete it!",
cancelButtonText: "No, cancel plx!",
closeOnConfirm: false,
closeOnCancel: false
},
function(isConfirm) {
if (isConfirm) {
swal("Deleted!", "Your Data file has been deleted.", "success");
} else {
swal("Cancelled", "Your Data file is safe :)", "error");
}
});
});
});
This is my Controller Code:
public function destroy($id)
{
$delete_website_type = WebsiteType::find($id);
$delete_website_type->delete();
return redirect()->back();
}
Please Give me the solution...
you have to put .then()
let id = $("#your_id").val();
swal({
title: "Are you sure?",
text: "You will not be able to recover this file!",
type: "warning",
showCancelButton: true,
confirmButtonText: "Yes, delete it!",
cancelButtonText: "No, cancel plx!",
closeOnConfirm: false,
closeOnCancel: false
}).then((isConfirm) => {
if(isConfirm) {
//you can just use fetchAPI
fetch(`route_to_your_destroy_method/${id}`)
.then(response => response.json()
.then(result => {
//your result
if (result == 'success') {
//alert success
}else {
//alert fail
}
}).catch(err => {console.log(err)});
}
});
and in your destroy method
$delete_website_type = WebsiteType::find($id)->delete();
if(delete_website_type) {
$message = 'success';
}else {
$message = 'fail';
}
return json_encode($message);
Give it a try
for delete button:---
<i class="far fa-trash-alt"></i>
in Jquery
$(document).on('click', '.button', function (e) {
e.preventDefault();
var id = $(this).data('id');
swal({
title: "Are you sure!",
type: "error",
confirmButtonClass: "btn-danger",
confirmButtonText: "Yes!",
showCancelButton: true,
},
function() {
$.ajax({
type: "POST",
url: "{{url('/setting/website_type/destroy')}}",
data: {id:id},
success: function (data) {
//
}
});
});
});
and
public function destroy(Request $request)
{
$delete_website_type = WebsiteType::find($request->id)->delete();
return redirect()->route('website.index')
->with('success','Website deleted successfully');
}
i have updated my answer try this one.

How to show sweetAlert Validation Delete Dialog in ASP MVC

I am developing an ASP MVC 5 web application using SQL Server. I am trying to delete a profile (client in database) via a button with javascript function.
Clicking on the button, the profile is deleted but the validation dialog doesn't appear. I don't know what the reason is but I doubt that there is an issue with the javascript code.
I tried also to create another button without submit, in order to verify the sweetAlert process. And it worked well.
This is my View :
#using (Html.BeginForm("Delete", "Client", new { ReturnUrl = ViewBag.ReturnUrl }, FormMethod.Post, new { #class = "form-horizontal", role = "form" }))
{
<input type="submit" value="Delete" class="btn btn-default" onclick="remove()">
}
<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
<script type="text/javascript">function remove() {
swal({
title: "Are you sure?",
text: "Once deleted, you will not be able to recover your profile!",
icon: "warning",
buttons: true,
dangerMode: true,
})
.then((willDelete) => {
if (willDelete) {
swal("Poof! Your profile has been deleted!", {
icon: "success",
});
} else {
swal("Your profil is safe!");
}
});
}
</script>
My Controller :
[HttpPost]
public ActionResult Delete(int id, Client cmodel)
{
try
{
ClientManagement cdb = new ClientManagement();
if (cdb.DeleteClient(id))
{
TempData["Message"]= "Client Deleted Successfully";
}
Session.Abandon();
return RedirectToAction("Index", "Home");
}
catch
{
return View();
}
}
UPDATE :
View :
<input type="button" value="Delete" class="btn btn-default" onclick="remove()">
<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
<script type="text/javascript">
function remove() {
swal({
title: "Are you sure?",
text: "Once deleted, you will not be able to recover your profile!",
icon: "warning",
buttons: true,
dangerMode: true,
})
.then((willDelete) => {
if (willDelete) {
$.ajax({
type: "POST",
url: "/Client/Delete",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (response) {
swal("Poof! Your profile has been deleted!", {
icon: "success",
}).then(function () {
window.location.href = "/Home/Index"
});
},
failure: function (response) {
alert(response.responseText);
},
error: function (response) {
alert(response.responseText);
}
});
}
else {
swal("Your profil is safe!");
}
});
}
</script>
You are trying to update onclick default behavior but you're not using preventDefault in your javascript code.
event.preventDefault()

Categories