.form-control with <input> tag
.form-control with <input> tag
.form-control with <input> tag
.form-control with <input> tag
Just add data-role="tagsinput" to your input field to automatically change it to a tags input field.
Use a <select multiple /> as your input element for a tags input, to gain true multi value support. Instead of a comma separated string, the values will be set in an array.
Existing <option />elements will automatically be set as tags. This makes it also possible to create tags containing a comma.
Typeahead is not included in Bootstrap 3, so you'll have to include your own typeahead library. I'd recommed typeahead.js. An example of using this is shown below.
You can set a fixed css class for your tags, or determine dynamically by providing a custom function.
Instead of just adding strings as tags, bind objects to your tags. This makes it possible to set id values in your input field's value, instead of just the tag's text.
.form-control with <input> tag
The badge will show up by default when the remaining chars are 10 or less:
Do you want the badge to show up when there are 20 chars or less? Use the threshold option:
Just add color-classwith input
All you need to do is specify the placement option, with one of those strings. If none is specified, the positioning will be defauted to 'top-right'.
Bootstrap maxlength supports textarea as well as inputs. Even on old IE.