Home / php / Integrasi dan Implementasi Sweet Alert Pada Laravel 5.1

Integrasi dan Implementasi Sweet Alert Pada Laravel 5.1

Sweet alert merupakan salah satu library javascript yang membuat tampilan alert javascript menjadi menawan. Dan untuk kali ini, kita akan mencoba mengimplementasikan ke dalam framework laravel.

sweetalert

1. Langkah awal berupa instalasi melalui file composer.json :

"require": {
"uxweb/sweet-alert": "~1.1"
}

lalu jalankan composer update.

2. Lalu tambah pada service provider yang berada di file app/config.php

'providers' => [
UxWeb\SweetAlert\SweetAlertServiceProvider::class
];

3. Untuk memudahkan juga, kita dapat tambahkan Facade di file yang sama

'aliases' => [
'Alert' => UxWeb\SweetAlert\SweetAlert::class
];

4. Jika sudah anda perlu mendownload file javascript dan css milik sweet alert di sini

Setelah didownload, pastikan anda melakukan pemanggilan pada file javascript dan css tersebut ke dalam file view Anda.

5.Lalu Anda perlu menambahkan/include view milik sweet alert ke dalam file view anda

@include('sweet::alert')

maka keseluruhan file view Anda kurang lebih menjadi seperti :

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <link rel="stylesheet" href="css/sweetalert.css">
</head>
<body>

    <div class="container">
        <p>Welcome to my website...</p>
    </div>

    <script src="js/sweetalert.min.js"></script>

    <!-- Include this after the sweet alert js file -->
    @include('sweet::alert')

</body>
</html>

Nah, untuk implementasi pemanggilan alert menggunakan facade di controller dapat dilakukan seperti :

public function store()
{
    Alert::message('Robots are working!');

    return Redirect::home();
}

fungsi lainnya :

Alert::message('Message', 'Optional Title');
Alert::basic('Basic Message', 'Mandatory Title');
Alert::info('Info Message', 'Optional Title');
Alert::success('Success Message', 'Optional Title');
Alert::error('Error Message', 'Optional Title');
Alert::warning('Warning Message', 'Optional Title');

atau jika menggunakan helper

public function destroy()
{
    Auth::logout();

    alert()->success('You have been logged out.', 'Good bye!');

    return home();
}

fungsi lainnya dalam helper :

alert()->message('Message', 'Optional Title');
alert()->basic('Basic Message', 'Mandatory Title');
alert()->info('Info Message', 'Optional Title');
alert()->success('Success Message', 'Optional Title');
alert()->error('Error Message', 'Optional Title');
alert()->warning('Warning Message', 'Optional Title');

alert()->basic('Basic Message', 'Mandatory Title')
    ->autoclose(3500);

alert()->error('Error Message', 'Optional Title')
    ->persistent('Close');

Masih banyak kustomisasi yang dapat dilakukan, untuk tahu lebih banyak bisa meluncur ke sini https://github.com/uxweb/sweet-alert

About alfach

Check Also

mqdefault

Middleware Session Timeout Laravel

Menentukan berapa lama session user berada didalam aplikasi adalah hal yang penting. Pengaturan session timeout ...

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>