Pada artikel kali ini saya akan membahas tentang Membuat Alert POP Up Cantik Dengan Alertify.js Di Laravel, sebuah pesan alert walaupun hal yang tidak terlalu rumit dalam menggunakanya tetapi alert adalah hal pentin dan wajib ada pada sebuah website, kenapa ? karena sebuah pesan alert akan sangan amat berguna untuk user experience karena dengan alert lah tanda suatu peroses belum atau sudah di lakukan.
Di sini saya akan membuat alert dengan library yang telah di buat oleh sesorang dengan memiliki tampilan yang cukup baik di bandingkan dengan alert bawaan javascript yang bergantung pada browser dan tidak enak di pandang.
Salin cade CDN berikut dan taruh pada bagian head:
|
1 2 3 4 |
<!-- javascript --> <script src="//cdn.jsdelivr.net/npm/alertifyjs@1.11.0/build/alertify.min.js"></script> <!-- CSS --> <link rel="stylesheet" href="//cdn.jsdelivr.net/npm/alertifyjs@1.11.0/build/css/alertify.min.css"/> |
setelah itu tinggal panggil, di sini saya menggunakan session untuk pengecekan jika yang aktif session tertentu maka akan muncul alert yang sessui dengan session tersebut .
|
1 2 3 4 5 6 7 8 9 10 11 |
@if(Session::has('order_success')) <script> alertify.alert('Status Order', 'Selamat Anda Telah Berhasil Melakukan Order')</script> @elseif(Session::has('confirm')) <script> alertify.alert('Konfirmasi Pembayaran', 'Pembayaran Anda Sedang Di Konfirmasi')</script> @elseif(Session::has('cartAdd')) <script> alertify.alert('Tambah Barang', 'Berhasil Memasukan Barang Ke Keranjang')</script> @elseif(Session::has('cartupdate')) <script> alertify.alert('Keranjang Belanja', 'Keranjang Belanja Anda Telah Di Update')</script> @elseif(Session::has('cartremove')) <script> alertify.alert('Keranjang Belanja', 'Keranjang Belanja Anda Telah Di Hapus Satu Item')</script> @endif |
Maka hasil alert nya akan seperti ini :
Gimana , jadi lebih bagus kan ? 🙂
Baiklah itu saja artiekel dari saya di akhir tahun ini sampai bertemu pada artikel selanjutnya di tahun yang baru 2018