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 :




    
    Document
    



    

Welcome to my website...

@include('sweet::alert')

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

You may also like...

Leave a Reply

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