Estou utilizando o Datatables com server-side processing e utilizando o SweetAlert2 para confirmar antes de excluir o registro. Está tudo funcionando, menos o sweet alert que não é exibido ao clicar no link de excluir.
Usando o datatables sem ajax, o sweet alert funciona normal. Ao clicar no <a class="dropdown-item sa-warning" style="cursor:pointer;" data-route="services/delete/' . $service->id . '">
onde tem a classe sa-warning, deveria chamar o script do sweet alert, mas nada acontece e não tem erro nenhum.
View
@extends('layouts.app')
@section('title', 'Serviços')
@push('styles')
<link href="{{ asset('plugins/datatables/dataTables.bootstrap4.min.css') }}" rel="stylesheet" type="text/css"/>
<link href="{{ asset('plugins/datatables/buttons.bootstrap4.min.css') }}" rel="stylesheet"
type="text/css"/>
@endpush
@section('content')
<div class="row">
<div class="col-12">
<div class="card-box table-responsive">
<div class="col-12 mb-3">
<a href="{{ route('services.create') }}" class="btn btn-custom waves-light waves-effect">Novo</a>
</div>
<table id="datatable" class="table table-bordered">
<thead>
<tr>
<th>Nome</th>
<th style="width: 5%">Ações</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
</div>
</div>
@endsection
@push('scripts')
<script src="{{ asset('plugins/datatables/jquery.dataTables.min.js') }}"></script>
<script src="{{ asset('plugins/datatables/dataTables.bootstrap4.min.js') }}"></script>
<script src="{{ asset('plugins/datatables/dataTables.buttons.min.js') }}"></script>
<script src="{{ asset('plugins/datatables/buttons.bootstrap4.min.js') }}"></script>
<script src="{{ asset('plugins/datatables/jszip.min.js') }}"></script>
<script src="{{ asset('plugins/datatables/pdfmake.min.js') }}"></script>
<script src="{{ asset('plugins/datatables/vfs_fonts.js') }}"></script>
<script src="{{ asset('plugins/datatables/buttons.html5.min.js') }}"></script>
<script src="{{ asset('plugins/datatables/buttons.print.min.js') }}"></script>
<script type="text/javascript">"use strict";
$(document).ready(function () {
$('#datatable').DataTable({
"processing": true,
"serverSide": true,
"ajax": {
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
"method": "POST",
"url": "{{ route('services.ajax.datatables') }}",
"dataType": "json"
},
"columns": [
{"data": "name"},
{"data": "actions", "searchable": false, "orderable": false}
]
});
});
</script>
@endpush
Sweet Alert
$('.sa-warning').click(function () {
$(this).each(function(){
var route = $(this).data("route");
swal({
title: 'Você quer apagar o registro?',
text: "Está ação não pode ser desfeita!",
type: 'warning',
showCancelButton: true,
confirmButtonClass: 'btn btn-confirm mt-2',
cancelButtonClass: 'btn btn-cancel ml-2 mt-2',
cancelButtonText: 'Cancelar',
confirmButtonText: 'Apagar!'
}).then(function () {
$.ajax({
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
type: 'DELETE',
url: route,
success:function(response){
window.location.href = response;
},
error:function(response){
console.log(response);
}
})
})
});
});
Routes
Route::post('services/ajax', 'ServiceController@ajaxDatatables')->name('services.ajax.datatables');
Route::get('services/delete/{service}', 'ServiceController@destroyServiceDatatables')->name('services.delete.datatables');
ServiceController
namespace App\Http\Controllers;
use App\Service;
use App\Http\Requests\ServiceRequest;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Session;
class ServiceController extends Controller
{
public function index()
{
$services = Service::all();
return view('service.index')
->with('services', $services);
}
public function ajaxDatatables(Request $request)
{
$columns = [
0 => 'name',
];
$totalData = Service::count();
$limit = $request->input('length');
$start = $request->input('start');
$order = $columns[$request->input('order.0.column')];
$dir = $request->input('order.0.dir');
if (empty($request->input('search.value'))) {
$services = Service::offset($start)
->limit($limit)
->orderBy($order, $dir)
->get();
$totalFiltered = Service::count();
} else {
$search = $request->input('search.value');
$services = Service::where('name', 'like', "%{$search}%")
->offset($start)
->limit($limit)
->orderBy($order, $dir)
->get();
$totalFiltered = Service::where('name', 'like', "%{$search}%")
->count();
}
$data = [];
if ($services) {
foreach ($services as $service) {
$nestedData['name'] = $service->name;
$nestedData['actions'] = '<div class="btn-group dropdown">
<a href="javascript: void(0);"
class="table-action-btn dropdown-toggle arrow-none btn btn-light btn-sm"
data-toggle="dropdown"
aria-expanded="false">
<i class="mdi mdi-dots-horizontal"></i>
</a>
<div class="dropdown-menu dropdown-menu-right">
<a class="dropdown-item" href="services/' . $service->id . '/edit">
<i class="mdi mdi-pencil mr-2 text-muted font-18 vertical-middle"></i>Editar</a>
<a class="dropdown-item sa-warning" style="cursor:pointer;"
data-route="services/delete/' . $service->id . '">
<i class="mdi mdi-delete mr-2 text-muted font-18 vertical-middle"></i>Excluir</a>
</div>
</div>';
$data[] = $nestedData;
}
}
$jsonData = [
"draw" => intval($request->input('draw')),
"recordsTotal" => intval($totalData),
"recordsFiltered" => intval($totalFiltered),
"data" => $data
];
echo json_encode($jsonData);
}
public function create()
{
return view('service.create');
}
public function store(ServiceRequest $request)
{
$service = Service::create($request->all());
Session::flash('alert-success', 'Serviço incluído com sucesso!');
return redirect()->route('services.index');
}
public function edit(Service $service)
{
return view('service.edit')
->with('service', $service);
}
public function update(ServiceRequest $request, Service $service)
{
$service->update($request->all());
Session::flash('alert-success', 'Serviço alterado com sucesso!');
return redirect()->route('services.index');
}
public function destroy(Service $service)
{
if ($service->orders->count() > 0) {
Session::flash('alert-warning', 'Existem orçamentos com esse serviço!');
return response(route('services.index'));
} else {
$service->delete();
Session::flash('alert-success', 'Serviço excluído com sucesso!');
return response(route('services.index'));
}
}
public function destroyServiceDatatables(Service $service)
{
$service->delete();
Session::flash('alert-success', 'Serviço excluído com sucesso!');
return redirect()->route('services.index');
}
}