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
Input group with radio
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.
Extra Small Input group
Add .input-group-xs
class to .input-group
for Xsmall 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.
Touchspin With Dropdown
Use data-bts-prefix & data-bts-postfix
attribute to set Prefix and Postfix to touchspin input with 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.