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.
