Max Length

Bootstrap Maxlength

Bootstrap Maxlength - a visual feedback indicator for the maxlength attribute.

Default

Bootstrap MaxLength with default options.

You can activate it by setting the maxlength attribute on an input.

Custom Threshold

You can set a custom threshold for the counter to apear, in this case, 6, meaning when the remaining characters are 6, show the counter.

This setting can be set via data-threshold.

Always Show The Counter

You can set an option, to make the counter's apearance constant.

This option can be activated by adding the data-always-show="true" to the input.

Custom Warning Text

You can also change the warning sentence.

To acheive the result you see in the showcase element, you should add

data-pre-text="You have entered "

data-separator=" chars out of the "

data-post-text=" chars allowed."

Available Positions

You can change the default positioning.

This option can be set by adding the data-position to the input.