Default Input group
Add span with .input-group-text class before <input>
Input group with Right Addon
Add span with .input-group-text class after <input>
Input group Addon on both side
Add span with .input-group-text class to before & after <input>
Input group addon with Icon
Input group addon with Right Icon
Input group addon with icon both side
Input group addon with Spinner
Input group addon with Right Spinner
Input group addon with Spinner both side
Input group with Checkbox
Input group with checkbox
Add span with .input-group-text class before <input> text and Add
checkbox inside.
Input group with Right Addon
Add span with .input-group-text class after <input> text and Add
checkbox inside.
Input group Addon on both side
Input group with Radio
Input group with radio
Add span with .input-group-text class before <input> text and Add radio
inside.
Input group with Right Addon
Add span with .input-group-text class after <input> text and Add radio
inside.
Input group Addon on both side
Input group with Switchery
Input group with Switchery
Add span with .input-group-text class before <input> text and Add
switchery inside.
Input group with Right Switchery
Add span with .input-group-text class after <input> text and Add
switchery inside.
Input group with switchery on both side
Input Groups Sizing
Large Input group
Add .input-group-lg class to .input-group for Large addon.
Default Input group
Default Input Group addon.
Small Input group
Add .input-group-sm class to .input-group for small addon.
Bootstrap TouchSpin Spinners
Default Touchspin
Add .touchspin class to input to add touchspin input group.
Touchspin with Postfix
Add data-bts-postfix="POSTFIX_VALUE" attribute to input to add postfix to touchspin input group.
Touchspin with Prefix
Add data-bts-prefix="PREFIX_VALUE" attribute to input to add prefix to touchspin input group.
Min Max Value of Touchspin
Use data-bts-min="VALUE" data-bts-max="VALUE" attribute to input to set min and max value of
touchspin input group.
Touchspin with initial Value
Add data-bts-init-val="VALUE" attribute attribute to set initial value for input group.
Touchspin steps
Add data-bts-step="VALUE" attribute for increament and decrement steps to touchspin input group.
Decimal Value of Touchspin
Use data-bts-decimal="VALUE" attribute to use decimal value of touchspin input.
vertical Touchspin
Add .touchspin-vertical class for vertical touchspin input group.
Touchspin mousewheel Disable
Add .touchspin-stop-mousewheel class to diable mousewheel.
Change Button Class to link
Add data-bts-button-down-class & data-bts-button-up-class attribute to change button Class.
Touchspin With Icon
Add icon class in data-bts-postfix attribute to icon to postfix as well prefix.
Touchspin Icon Button
Use data-bts-button-down-txt & data-bts-button-up-txt attribute to set touchspin icon button.
Spinners Sizes
Large Horizontal Touchspin
Add .input-group-lg class to input-group.
Default Horizontal Touchspin
Small Horizontal Touchspin
Add .input-group-sm class to input-group and add .input-sm class to input.
Spinners Color Options
Primary Touchspin
set data-bts-button-down-class & data-bts-button-up-class attribute and add value as btn
btn-primary for Primary color spinner.
Secondray Touchspin
set data-bts-button-down-class & data-bts-button-up-class attribute and add value as btn
btn-secondary for Primary color spinner.
Success Touchspin
set data-bts-button-down-class & data-bts-button-up-class attribute and add value as btn
btn-success for Success color spinner.
Danger Touchspin
set data-bts-button-down-class & data-bts-button-up-class attribute and add value as btn
btn-danger for Danger color spinner.
Info Touchspin
set data-bts-button-down-class & data-bts-button-up-class attribute and add value as btn
btn-info for Info color spinner.
Warning Touchspin
set data-bts-button-down-class & data-bts-button-up-class attribute and add value as btn
btn-warning for Warning color spinner.