Elastic textarea
contentEditable attribute, but
retains default textarea functionality. The
autosize function accepts a single textarea
element, or an array or array-like object (such as a NodeList
or jQuery collection) of textarea elements.
Drop Autosize into any existing website and it should Just Workâ˘. The source is short and well commented if you are curious to how it works.
When the value of a textarea has been changed through
JavaScript, trigger the
autosize.resize event immediately after to
update the height.
The library supports
autosize:resized event, which is fired
every time autosize adjusts the textarea height. Check
console log.
Trigger the autosize.destroy event to
remove autosize from a textarea element. Once
destroy button clicked, autosize will be
removed.
Masked inputs
keydown and on input actual
processing takes place.
Password generator
Password checker is displayed as text form helper, which appears below the input field. You can easily change the appearance of text feedback in JS configuration.
Password checker is attached to the badge, which appears below the input field. Empty badge is hidden, if you add any text inside badge, it'll stay visible.
In this example password checker appears as input group
text addon. Can be left and/or right
aligned, supports all input group styles. Styles can be
adjusted in JS config.
Rules are the same as for password checker inside badge,
but this one has absolute position and placed inside
form-group. Empty badge is also hidden.
Maxlength
maxlength to work. The indicator shows up on
focusing on the element, and disappears when the focus is
lost. Try out demo configuration below.
Basic example of maxlength plugin. The badge will show up right below the input by default when the remaining chars are 10 or less. This is a default value and position.
The field counter can be positioned at the top, bottom,
left or right via placement option. You can
also place the maxlength indicator on the corners:
bottom-right, top-right, top-left, bottom-left and
centered-right.
This is a complete example where all the options
configured for the bootstrap-maxlength counter are
setted. Please note: if the
alwaysShow option is enabled, the
threshold option is ignored.
Do you want the badge to show up when there are 20 chars
or less? Use the threshold option. In this
example badge appears when the remaining chars are
15 or less.
Example with custom options. All options can be mixed: here badge will show up after entering 10 characters, badge has different color and shows up after the limit is reached.
Bootstrap maxlength supports textarea as well as inputs. Even on old IE. Maxlength, attached to the textarea supports all available options and settings by default.