Bootstrap Maxlength | CORK - Multipurpose Bootstrap Dashboard Template

Basic Positions

Use threshold option to show up when there are 20 chars or less

$('input.threshold').maxlength({
    threshold: 20,
});

Use warningClass option to change default badge color and limitReachedClass option to change the badge after limit reached.

$('input.few-options').maxlength({
    warningClass: "badge badge-success",
    limitReachedClass: "badge badge-warning"
});

Use preText option to prepend text, postText option to postpend text and separator option to add a seperator in between max and min length .

$('input.alloptions').maxlength({
    separator: ' of ',
    preText: 'You have ',
    postText: ' chars remaining.'
});

Use placement: top-left to align badge at the top left corner.

$(selector).maxlength({
    placement:"top-left"
});

Use placement: top-right to align badge at the top right corner.

$(selector).maxlength({
    placement:"top-right"
});

Use placement: left to align badge at the left corner.

$(selector).maxlength({
    placement:"left"
});

Use placement: right to align badge at the right corner.

$(selector).maxlength({
    placement:"right"
});

Use placement: bottom-left to align badge at the bottom left corner.


$(selector).maxlength({
    placement:"bottom-left"
});

Use placement: bottom-right to align badge at the bottom right corner.

$(selector').maxlength({
    placement:"bottom-right",
});

Use placement: bottom to align badge at the bottom corner.

$(selector).maxlength({
    placement:"bottom",
});