API.

Options

The uCount() function accepts an object with option-value pairs. The available options are the following:

allowEmpty

If true, 0 characters will be treated as a valid string length despite a higher minimum length value.

Possible values
true, false
Default value
false
$("#foo").uCount({ allowEmpty: true });

attributes

Attribute-value pairs or HTML attributes that should be applied to the counter container.

Possible values
any object
Default value
{}
$("#foo").uCount({ attributes: { "rel": "counter" } });

className

Class name of the counter element.

Possible values
any string
Default value
"counter"
$("#foo").uCount({ className: "my-counter" });

countdown

Count down from the maximum value instead of counting up from zero. In order for this to work, the max option needs to be set as well.

Possible values
true, false
Default value
false
$("#foo").uCount({ countdown: true });

max

Maximum number of characters before triggering a "too many" error. 0 = no upper limit.

Possible values
any non-negative integer
Default value
0
$("#foo").uCount({ max: 32 });

min

Minimum number of characters before triggering a "too few" error.

Possible values
any non-negative integer
Default value
0
$("#foo").uCount({ min: 5 });

onUpdate

The callback function executed each time the character counter is updated. The function takes one parametre: the counter jQuery object.

Possible values
any function
Default value
null
$("#foo").uCount({ onUpdate: function(counter) {
    counter.text(counter.text() + '!');
} });

placement

Counter placement relative to the target element:

  • "after" - immediately after the target
  • "before" - immediately before the target
  • "append" - inside the target, appended to its contents (if any)
  • "prepend" - inside the target, prepended to its contents (if any)
Possible values
a string: either "after", "before", "append" or "prepend"
Default value
"after"
$("#foo").uCount({ placement: "before" });

tag

The name of the tag that should be used as a container for the counter.

Possible values
any string denominating a HTML tag name (e.g. "div")
Default value
"span"
$("#foo").uCount({ tag: "div" });

target

The object after which (or before, etc., depending on the value of the placenemt option) the counter will be placed. If null, the counter will be placed relative to the text input it is called on.

Possible values
a jQuery object
Default value
null
$("#foo").uCount({ target: $("#foo") });

tooFewClassName

Class name added to the counter when a "too few" error is triggered.

Possible values
any string
Default value
"too-few"
$("#foo").uCount({ tooFewClassName: "write-more" });

tooManyClassName

Class name added to the counter when a "too many" error is triggered.

Possible values
any string
Default value
"too-many"
$("#foo").uCount({ tooManyClassName: "write-less" });