لودینگ هنگام لود شدن وب ویو + حذف اسکرول افقی اضافی از WebView
2019-05-11
آموزش تابع Serialize() در php به همراه مثال
2019-05-19کتابخانه SweetAlert2 استفاده از SweetAlert2 با AJAX در لاراول
استفاده از SweetAlert2 با AJAX در لاراول ، در این پست از تجاری اپ قصد داریم نحوه استفاده از کتابخانه SweetAlert2 در لاراول با AJAX را آموزش دهیم.این آموزش خیلی ابتدایی نمی باشد به همین دلیل ما فرض می کنیم که شما نحوه ی ایجاد Route ، نحوه ی ایجاد کنترلر ، view ها و غیره را می دانید و از گفتن آنها صرف نظر می کنیم.با ماهمراه باشید.
استفاده از کتابخانه SweetAlert2 به همراه AJAX در لاراول
- ایجاد متدها در کنترلر
- تعریف Route
- بکار بردن SweetAlert2 همراه با AJAX در فایل Blade
- اجرا و مشاهده خروجی
همچنین بخوانید: آموزش آپلود چندین عکس با Dropzone در لاراول 5.8
ایجاد متدها در کنترلر
ما یک کنترلر با نام UserController ایجاد کرده ایم و در این کنترلر دو متد ایجاد می کنیم یکی برای گرفتن همه کارابران و دیگری برای حذف یک کاربر.کدهای مربوط به این کنترلر و متدهایی که در آن ایجاد کرده ایم را در زیر مشاهده می کنید:
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use DB;
use App\User;
class UserController extends Controller
{
public function users()
{
$users = User::all();
return view('users', compact('users'));
}
public function delete($id)
{
$delete = User::where('id', $id)->delete();
// check data deleted or not
if ($delete)
{
$success = true;
$message = "کاربر با موفقیت حذف شد!";
} else {
$success = true;
$message = "کاربر پیدا نشد!";
}
// Return response
return response()->json([
'success' => $success,
'message' => $message,
]);
}
}
تعریف Route
در این مرحله دو Route برای دو متدهایی که در کنترلر ایجاد کردیم ، تعریف می کنیم:
<?php
Route::get('users', 'UserController@users');
Route::post('delete/{id}', 'UserController@delete');
بکار بردن کتابخانه SweetAlert2 همراه با AJAX در فایل Blade
یک View با نام users.blade.php ایجاد کنید و کدهای زیر را در ان وارد کنید:
<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- csrf-token -->
<meta name="csrf-token" content="{{ csrf_token() }}">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
<!-- jquery -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
<!-- SweetAlert2 -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/7.2.0/sweetalert2.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/7.2.0/sweetalert2.all.min.js"></script>
<title>استفاده از SweetAlert2 با AJAX در لاراول</title>
</head>
<body class="container" style="direction:rtl; text-align:right; margin-top: 40px;">
<div class="row" style="margin-bottom: 20px;">
<div class="col-lg-12 margin-tb">
<div class="pull-right">
<h3>کاربران</h3>
</div>
</div>
</div>
<table class="table table-bordered">
<tr>
<th>شناسه</th>
<th>نام</th>
<th>ایمیل</th>
<th width="280px">عملیات</th>
</tr>
@foreach ($users as $user)
<tr>
<td>{{ $user->id }}</td>
<td>{{ $user->name }}</td>
<td>{{ $user->email }}</td>
<td>
<button class="btn btn-danger" onclick="deleteConfirmation({{$user->id}})">حذف</button>
</td>
</tr>
@endforeach
</table>
<script type="text/javascript">
function deleteConfirmation(id) {
swal({
title: "حذف؟",
text: "لطفا اطمینان حاصل کنید و سپس تایید کنید!",
type: "warning",
showCancelButton: !0,
confirmButtonText: "بله، آن را حذف کنید!",
cancelButtonText: "خیر، لغو!",
reverseButtons: !0
}).then(function (e) {
if (e.value === true) {
var CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');
$.ajax({
type: 'POST',
url: "{{url('/delete')}}/" + id,
data: {_token: CSRF_TOKEN},
dataType: 'JSON',
success: function (results) {
if (results.success === true) {
swal("انجام شد!", results.message, "success");
} else {
swal("خطا!", results.message, "error");
}
}
});
} else {
e.dismiss;
}
}, function (dismiss) {
return false;
})
}
</script>
</body>
</html>
اجرا و مشاهده خروجی
اکنون پروژه لاراول خود را اجرا کنید و سپس آدرس http://localhost:8000/users را در مرورگر خود مشاهده نمایید.اگر همه مراحل را بدرستی انجام داده باشید باید یک صفحه مانند تصویر زیر مشاهده کنید:
همچنین بخوانید: دریافت id آخرین رکورد درج شده در جدول در لاراول 5.8
برای مشاهده باکس تأیید SweetAlert2 بر روی دکمه حذف کلیک کنید.
اگر دکمه بله را انتخاب کنید، داده ها از طریق AJAX حذف خواهند شد و پیام تأییدیه ای مانند تصویر زیر مشاهده خواهید کرد:
امیدوارم این آموزش به شما کمک کرده باشد.
