Livewire Toggle switch with alert notification
Tech Stack: bootstrap-5, new, livewire
Demo
Name | Active | |
---|---|---|
Dr. Celine Terry | anabelle.reichert@example.org | |
Einar Fay | tiara.mueller@example.org | |
Devante Barton | jspinka@example.com | |
Florence Ruecker | bdooley@example.org | |
Mrs. Irma Schultz | emma.kassulke@example.org | |
Tyrel Rice Jr. | bmills@example.net | |
Dallin Kuhlman | crawford83@example.org | |
Addie Kunze | hane.xzavier@example.com | |
Jenifer Champlin | schuster.hardy@example.com | |
Prof. Reinhold Heller | carmel02@example.net |
Code
Please login to View/Download the Code
Please login to View/Download the Code
Sorry, this component's code is restricted
Get Livewiredemos-Pro
Sorry, this component's code is restricted
Get Livewiredemos-Pro
Usage
@livewire('toggle-switch-alert', [
'model' => $dummyUser,
'field' => 'isActive',
'status' => [
'off' => "User {$dummyUser->name} is disabled",
'on' => "User {$dummyUser->name} is enabled"
]
])
Documentation
This component is an extention of Simple Toggle Switch Component
This is a toggle-switch with an alert livewire component using bootstrap-5 which alters the boolean field in the database and also shows an alert notification to the user.
For the alerts, we have done a simple integration with Notyf javascript plugin. You can read more about Livewire Notyf Integration.