Livewire Toggle switch with alert notification

Tech Stack: bootstrap-5, new, livewire

Demo

Name Email Active
Monserrat Skiles austin50@example.com
Ms. Mara Bogisich jpowlowski@example.com
Leif Kling stracke.alyce@example.com
Devan Herzog V pstamm@example.com
Westley Glover bernardo.balistreri@example.net
Everardo Streich danika.jerde@example.net
Miss Octavia Swaniawski V kody92@example.org
Deion Cronin claudia.sawayn@example.net
Dr. Niko West I javier64@example.net
Forest Mayer ruby.mayert@example.net

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.