Hướng dẫn sweet alert in php - cảnh báo ngọt ngào trong php

Introduction

'providers' => [
    // Other service providers...

    RealRashid\SweetAlert\SweetAlertServiceProvider::class,
],

Package

'providers' => [
    // Other service providers...

    RealRashid\SweetAlert\SweetAlertServiceProvider::class,
],

6 chỉ hổ trợ từ phiên bản laravel 5.5 trở lên.

Install

Để cài đặt SweetAlert2 trong laravel, chúng ta sử dụng composer.

composer require realrashid/sweet-alert

Configuration

Sau khi cài đặt xong package, chúng ta phải đăng kí

'providers' => [
    // Other service providers...

    RealRashid\SweetAlert\SweetAlertServiceProvider::class,
],

'providers' => [
    // Other service providers...

    RealRashid\SweetAlert\SweetAlertServiceProvider::class,
],

'providers' => [
    // Other service providers...

    RealRashid\SweetAlert\SweetAlertServiceProvider::class,
],

Thêm

'Alert' => RealRashid\SweetAlert\Facades\Alert::class,

'Alert' => RealRashid\SweetAlert\Facades\Alert::class,

'Alert' => RealRashid\SweetAlert\Facades\Alert::class,

Thêm thư viện 'Alert' => RealRashid\SweetAlert\Facades\Alert::class, 2 vào layout

Install thư viện javascript

'Alert' => RealRashid\SweetAlert\Facades\Alert::class,

npm i sweetalert2

hoặc sử dụng link cdn

Trong file master layout của bạn, import thư viện

'Alert' => RealRashid\SweetAlert\Facades\Alert::class,

Sau đó include sweetalert view.

@include('sweetalert::alert')

Usage

Sử dụng 'Alert' => RealRashid\SweetAlert\Facades\Alert::class, 5

Đầu tiên bạn phải import Alert Facade,

'Alert' => RealRashid\SweetAlert\Facades\Alert::class,

'Alert' => RealRashid\SweetAlert\Facades\Alert::class,

Alert::alert('Title', 'Message', 'Type');
Alert::success('Success Title', 'Success Message');
Alert::info('Info Title', 'Info Message');
Alert::warning('Warning Title', 'Warning Message');
Alert::error('Error Title', 'Error Message');
Alert::question('Question Title', 'Question Message');
Alert::html('Html Title', 'Html Code', 'Type');
Alert::toast('Toast Message', 'Toast Type', 'Toast Position');

Sử dụng hàm 'Alert' => RealRashid\SweetAlert\Facades\Alert::class, 8

Alert

alert('Title','Lorem Lorem Lorem', 'success');

alert()->success('Title','Lorem Lorem Lorem');

alert()->info('Title','Lorem Lorem Lorem');

alert()->warning('Title','Lorem Lorem Lorem');

alert()->question('Title','Lorem Lorem Lorem');

alert()->error('Title','Lorem Lorem Lorem');

alert()->html('HTML example'," You can use bold text, links and other HTML tags ",'success');

Toast

toast('Your Post as been submited!','success','top-right');

Demo

Success Alert & Success Error

Hiển thị thông báo khi tạo 1 post thành công hoặc thất bại.

'providers' => [
    // Other service providers...

    RealRashid\SweetAlert\SweetAlertServiceProvider::class,
],

Methods Definition

'Alert' => RealRashid\SweetAlert\Facades\Alert::class,

'providers' => [
    // Other service providers...

    RealRashid\SweetAlert\SweetAlertServiceProvider::class,
],

Hàm này có 2 đối số truyền vào:

• npm i sweetalert2
  

  0: giá trị mặc định là true, cài đặt hiển thị buttom comfirm.

• npm i sweetalert2
  

  1 mặc định là false, cài đặt hiển thị buttom close.

npm i sweetalert2

'providers' => [
    // Other service providers...

    RealRashid\SweetAlert\SweetAlertServiceProvider::class,
],

Đối số

npm i sweetalert2

npm i sweetalert2

npm i sweetalert2

npm i sweetalert2

npm i sweetalert2

npm i sweetalert2

npm i sweetalert2

'providers' => [
    // Other service providers...

    RealRashid\SweetAlert\SweetAlertServiceProvider::class,
],

Config button confirm, cancel, close.

npm i sweetalert2

'providers' => [
    // Other service providers...

    RealRashid\SweetAlert\SweetAlertServiceProvider::class,
],

Import code html vào footer của alert.

npm i sweetalert2

npm i sweetalert2

'providers' => [
    // Other service providers...

    RealRashid\SweetAlert\SweetAlertServiceProvider::class,
],

Một vài hình ảnh demo

Các bạn có thể tham khảo chi tiết tại https://github.com/realrashid/sweet-alert