Download the PHP package prokki/twbs-toggle-buttons without Composer
On this page you can find all versions of the php package prokki/twbs-toggle-buttons. It is possible to download/install these versions without Composer. Possible dependencies are resolved automatically.
Download prokki/twbs-toggle-buttons
More information about prokki/twbs-toggle-buttons
Files in prokki/twbs-toggle-buttons
Package twbs-toggle-buttons
Short Description A small javascript snippet to use Bootstrap Button Groups (https://getbootstrap.com/components/button-group/) for toggle buttons.
License MIT
Homepage https://github.com/prokki/twbs-toggle-buttons
FAQ
Example:
In general, it is recommended to use always a project to download your libraries. In an application normally there is more than one library needed.
- Some hosting areas are not accessible by a terminal or SSH. Then it is not possible to use Composer.
- To use Composer is sometimes complicated. Especially for beginners.
- Composer needs much resources. Sometimes they are not available on a simple webspace.
- If you are using private repositories you don't need to share your credentials. You can set up everything on our site and then you provide a simple download link to your team member.
- Simplify your Composer build process. Use our own command line tool to download the vendor folder as binary. This makes your build process faster and you don't need to expose your credentials for private repositories.
Informations about the package twbs-toggle-buttons
Twitter Bootstrap Toggle Buttons
This is a small javascript snippet extending the Bootstrap Button Groups to use the toggle buttons as radio buttons or checkboxes.
Have a look at jsfiddle.
Table of Contents
- Integrations
- The Basics
- Options
- twbsBtnSelector
- classActive
- classInctive
- Events
- Click Event
- twbsToggleButtons:activate Event
- Tricks and Tips
- Checkboxes or Radio Buttons
- Required Radio Group
- Overwrite classActive
Integrations
Download the code from GitHub and copy the dist directory to your project.
Include the following lines of code in the <head> section of your HTML.
The Basics
Options
twbsBtnSelector
default:
'[role="button"]'
The default selector of all buttons is [role="button"]. To avoid this special html attribute you can change the option twbsBtnSelector, for instance to a class.
classActive
default:
'btn-success'
To detect an optical difference between active and inactive toggle buttons the two options classActive and
classInactive are set to default bootstrap classes. Change the options and use other classes to make a
difference between both toggle states.
Hint: Use an array of classes to set multiple classes.
classInactive
default:
'btn-secondary'
See classActive
Events
To avoid problems with the order of executing click events on the twbs-toggle-buttons you can use two event types to handle events.
Click Event
The click event is fired on the button.
:exclamation: Be careful to get the right state of the button! To get the state after button toggling use event twbsToggleButtons:activate Event.
twbsToggleButtons:activate Event
This event is fired after the state of the button getting activated was changed.
Tricks and Tips
Checkboxes or Radio Buttons
Required Radio Group
If radio buttons are used, usually exactly one button must be active.
To allow a button group without any active button, dismiss the attribute required in the input fields.
Overwrite classActive
Sometimes it is useful to change the active class of single toggle button. To do so, add the tml data attribute data-twbs-toggle-buttons-class-active
with a corresponding class.
